Scrolltrigger with animating while not scrolling

[Antibreez]

Hello! Here is my problem.

 

I have animation: several blocks moving along some path. This animation is snapped to ScrollTrigger with normal speed. And also I need to make same animation, but very slow when this block is in viewport but page is not scrolling at the moment. Can anyone please help to solve it?

 

So I need both: 1. animation on ScrollTrigger with normal speed and 2. Infinite slow animation while not scrolling.

 

See the Pen zYXBowz?editors=1010 by antibreez (@antibreez) on CodePen

[Rodrigo]

Hi @Antibreez and welcome to the GSAP Forums!

 

In this particular case is better to not tie the animation to ScrollTrigger and have it running on an endless loop, then use ScrollTrigger to play with the animation's timeScale property, like this:

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

 

Finally I'd suggest this approach by @PointC, is far simpler and easier to maintain IMHO:

 

Hopefully this helps.

Happy Tweening!

[Rodrigo]

I also forgot, last but not least, check this video @Carl made about this particular subject, it's really great:

 

[Antibreez]

10 hours ago, Rodrigo said:

Hi @Antibreez and welcome to the GSAP Forums!

 

In this particular case is better to not tie the animation to ScrollTrigger and have it running on an endless loop, then use ScrollTrigger to play with the animation's timeScale property, like this:

 

 

 

Finally I'd suggest this approach by @PointC, is far simpler and easier to maintain IMHO:

 

Hopefully this helps.

Happy Tweening!

Thank you very much!