데브허브 | DEVHUB | GSAP Is Now 100% FREE
- GSAP와 모든 플러그인이 이제 100% 무료로 제공되어 웹 애니메이션 접근성이 크게 향상되었습니다. 💸
- JavaScript에서 정교하고 부드러운 애니메이션을 구현하는 데 최적화된 강력한 라이브러리입니다. ✨
- GTA 6 웹사이트의 비디오 스크러빙 효과나 Film Foundation 사이트의 스크롤 애니메이션 등 고품질 웹사이트에서 널리 활용됩니다. 🎮
- SVG 모핑, 모션 패스, 사용자 정의 속성, 심지어 사용자 정의 JavaScript 객체까지 모든 것을 애니메이션할 수 있는 뛰어난 유연성을 제공합니다. 🎨
- 애니메이션의 핵심은
to, from, fromTo, set의 네 가지 유형으로 구성된 '트윈(Tween)'입니다. ➡️
- 클래스, ID, 또는 실제 DOM 객체 등 다양한 방식으로 애니메이션할 요소를 유연하게 타겟팅할 수 있습니다. 🎯
repeat(-1은 무한 반복) 및 yoyo(앞뒤로 반복)와 같은 특수 속성으로 애니메이션 동작을 정교하게 제어할 수 있습니다. 🔄
- 여러 애니메이션을 제어하는 두 가지 주요 방법으로, 순차적 지연을 위한
stagger와 정밀한 타이밍 제어를 위한 timeline이 있습니다. ⏱️
play(), pause(), restart() 등 강력한 메서드를 통해 애니메이션의 재생 상태를 완벽하게 제어할 수 있습니다. ▶️
- ScrollTrigger (스크롤 기반 애니메이션), ScrollSmoother, SplitText 등 복잡하고 고급스러운 효과를 위한 다양한 플러그인을 제공합니다. ⚙️
- ScrollTrigger 플러그인을 활용하여 GTA 6 사이트와 같은 비디오 스크러빙 효과를 몇 줄의 코드로 쉽게 구현할 수 있습니다. 🎬