Category: GSAP

GSAP is an industry standard JavaScript animation library from GreenSock that lets you craft high-performance animations that work in every major browser.

Scroll pinning examples to create object – GSAP

GSAP

Here are some Scroll pinning examples to create objects using GSAP Creating a gun See the Pen Image decompose on scroll – ScrollTrigger by Puneet Sharma (@webdevpuneet) on CodePen. Creating a Shoe See the Pen Scroll to construct a shoe – ScrollTrigger by...

Skew on scroll using scroll velocity – ScrollTrigger

GSAP

Here is a nice example of Skew on scroll using scroll velocity – ScrollTrigger See the Pen Skew on scroll using scroll velocity – ScrollTrigger by Puneet Sharma (@webdevpuneet) on CodePen.

Scroll Map Reveal Route – GSAP

GSAP

Here is a cool example of revealing a route with red color on a map that is revealed by scrolling down the page. See the Pen Scroll Map (Sunday Bike Route) by Puneet Sharma (@webdevpuneet) on CodePen.

Animate a Coffee Drinking Sprite With ScrollTrigger

GSAP

Here is a very cool example of animating a coffee-drinking sprite with GSAP’s scrolltrigger plugin. See the Pen How to Animate a Coffee Drinking Sprite With ScrollTrigger by Puneet Sharma (@webdevpuneet) on CodePen.

Scrolling through a tube using scrolltrigger – GSAP

GSAP

Here is an amazing site to watch that looks like a space tunnel to reach the other end by scrolling in and out. See the Pen 🚄 ScrollTriggering Through a Tube GSAP – ScrollTrigger Demo by Puneet Sharma (@webdevpuneet) on CodePen.

Stacking card animation effect – GSAP

GSAP

Here is a nice example of a stacking card animation effect using GSAP. Have fun! See the Pen stacking card animation effect by Puneet Sharma (@webdevpuneet) on CodePen.