Scrolling chronology

[ROCHE]

Hi,

 

Im trying to reproduce this kind of effects https://mtcubacenter.org/about/history/ (heroscreen with dates changing on scroll wheel).

Im a beginner with GSAP, can someone give some tips to help me ?

 

Thanks and have a good day,

See the Pen KKrbLKq by Gloyrus (@Gloyrus) on CodePen

[Rodrigo]

Hi @ROCHE and welcome to the GreenSock forums!

 

Thanks for being a Club GreenSock member and supporting GreenSock!

 

I think the best approach or that particular behaviour is to use the Observer Plugin:

https://greensock.com/docs/v3/Plugins/Observer

 

Here is a basic example:

See the Pen XWzRraJ by GreenSock (@GreenSock) on CodePen

 

The good thing about it is that you can then disable the Observer instance after you reach the final part of that particular section, like this example:

See the Pen oNdNLxL by GreenSock (@GreenSock) on CodePen

 

Hopefully this helps.

Happy Tweening!