Javascript 특정 요소, 특정 페이지에서만 작동 시키는 방법

에 의해서 | 2024년 12월 2일

Divi child 테마에 gsap js 파일로 올리면 A 페이지에 적용된 코드때문에 B페이지에서 에러 나는 경우가 생김 따라서 특정 페이지에 해당 코드가 적용되게 하거나, 특정 요소에서만 해당 코드가 적용되게 해야 함 1. 특정 요소가 있는 경우에만 코드 적용되게 하기 2. 특정 페이지에만 코드 적용되게...

GSAP 워드프레스에서 사용하기

에 의해서 | 2024년 11월 10일

참고 : https://gsap.com/community/forums/topic/30549-how-to-add-gsap-animations-to-wordpress/ 1. Divi-child 테마 functions.php 에 코드 삽입 (아래 코드 – 변형된 형태로 ) get_template_directory_uri() -> get_stylesheet_directory_uri() 2. Divi-child 테마 js 폴더에 gsap-ani.js 로 내가 만든 코드...

css – mix-blend-mode

에 의해서 | 2024년 11월 3일

mix-blend-mode https://www.designkits.co.kr/blog/web-css/text/MIX-BLEND-MODE https://ctrlcccv.github.io/code/2023-08-23-blend/#google_vignette 사용 사이트 : https://readymag.website/dariobuzzini/YW/4/

CSS animation scroll AOS CSS애니메이션 AOS 와 함께 사용, 스크롤시 애니메이션

에 의해서 | 2024년 2월 22일

CSS Animation with AOS CSS Animation을 사용하면 페이지 뜨자 마자 실행되서 스크롤해서 내려보면 이미 실행이 되어 있음 스크롤 했을때 CSS Animation 시작되게 1.  AOS 세팅AOS CDN + 세팅 참고 2. 헤더에 AOS CDN 넣고 Body에 AOS init 코드 삽입 3. 임의의 data-aos 만든 후 ( Custom CSS ) 4. 해당 aos가 발동하면 CSS 애니메이션 시작하게 세팅 ( Custom CSS ) 5. 원하는...