Animated text with disappearing gradient...help

[leonmktg]

https://bugatti-smartwatches.com/

 

If you scroll down you will see most of the sections titles fade in with a gradient and then display as solid white after the scroll action. I use wordpress and elementor pro. How can this be accomplished?

[akapowl]

 

Hey @leonmktg

 

This thread here should help as a good starting point. If you then want to trigger the animation on scroll like on that website you linked to, ScrollTrigger is what you're looking for.

 

 

 

[leonmktg]

@akapowl

 

Thanks for the reply. I want the effect to reveal and hide with scroll the way apple did it on the iPhone 12 pro site.

 

Demo Link:

https://www.apple.com/uk/iphone-12-pro/

[akapowl]

 

I think they do it a bit different there, but since this has already been asked, this thread here should help.

 

 

[leonmktg]

Perfect! this worked out exactly how i wanted it. Thank you for the suggestion. I really appreciate it. I also learned how to use codepen. I was able to make my adjustments and figure out how to load the script files. Thanks Again.