Custom GSAP plugin

[ilyasseisov]

Hi!

 

Please tell, is it possible to create a custom simple "Animate on Scroll" GSAP plugin?

Nothing fancy, just when user scrolls element fades up.

 

Usage example:

<p class="fade-up">hello</p>

 

The "fade-up" class comes from custom GSAP plugin.

 

Thanks in advance!

 

[mvaneijgen]

The beauty of GSAP is that you can build what ever you like. In comparison to other plugins you've used that do one specific thing, GSAP can do anything you can think of! The only thing holding you back is your own creativity. 

 

For This I would give all the elements you want to fade up a class like you do in your example and then create an animation that does what you want and hook that to ScrollTrigger.

 

If you need further assistance. please provide a minimal demo so we can take a look at your setup in action. Hope it helps and happy tweening! 

[Rodrigo]

Hi,

 

There is no need for a custom plugin, GSAP already has ScrollTrigger that should do what you're looking for:

https://gsap.com/docs/v3/Plugins/ScrollTrigger/

 

Finally here are a collection of ScrollTrigger demos that can definitely help:

https://codepen.io/collection/AEbkkJ

 

Happy Tweening!