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.

Fill outlined text with color – GSAP

Fill outlined text with color – GSAP

Here is a working example to create an outlined text and fill it on hover with GSAP See the Pen GSAP Text Fill by Puneet Sharma (@webdevpuneet) on CodePen.

ScrollTrigger Layered Pin – GSAP

ScrollTrigger Layered Pin – GSAP

Here is an example of horizontal and vertical section scrolls while a user scrolls up and down. See the Pen ScrollTrigger Layered Pin by Puneet Sharma (@webdevpuneet) on CodePen. Another example: ScrollTrigger feature: containerAnimation See the Pen Horizontal...

Horizontal scroll effect – GSAP

Horizontal scroll effect – GSAP

Here is a demo for a horizontal list scroll while user scrolls up and down. See the Pen ScrollTo Demo by Puneet Sharma (@webdevpuneet) on CodePen.

Marquees with scroll effect – GSAP

Marquees with scroll effect – GSAP

Here is the GSAP version of a marquee that responds to scroll speed DEMO See the Pen Marquees by Puneet Sharma (@webdevpuneet) on CodePen.

Custom cursor on a particular section – GSAP

Custom cursor on a particular section – GSAP

Here is an example of a custom cursor on a particular section. DEMO See the Pen Custom cursor on a particular section by Puneet Sharma (@webdevpuneet) on CodePen.

SVG MotionPathHelper – GSAP

SVG MotionPathHelper – GSAP

Here is an example of an SVG motion path animation helper plugin by GSAP. See the Pen MotionPathHelper demo by Puneet Sharma (@webdevpuneet) on CodePen.