gsap-fundamentals

What problem does it solve?

This Skill helps you create and control animations using the GreenSock Animation Platform (GSAP), enabling dynamic and engaging visual effects on web pages.

Core Features & Use Cases

• Core Tweening: Animate properties using gsap.to(), gsap.from(), gsap.fromTo(), and gsap.set().
• Timing & Easing: Control animation duration, delay, repetition, and apply various easing functions for natural motion.
• Timeline Management: Sequence multiple animations for complex sequences.
• Use Case: Quickly add a fade-in effect to a modal window, animate a button's scale on hover, or create a complex sequence of elements appearing on scroll.

Quick Start

Use GSAP to animate the 'box' element to move 200 pixels to the right over 1 second with a power2.out easing.