Jump to content


Gsap vertical infinite loop

Moderator Tag
Go to solution Solved by GreenSock,

Recommended Posts

Hello, I have two endless loop animations going in different directions, but the animation on the right does not start from the top like the other one and works problematic.
Can you help me?


See the Pen abRBjzY by sukruemanet (@sukruemanet) on CodePen

Link to comment
Share on other sites

Anytime. 👍

Link to comment
Share on other sites

  • 2 weeks later...

Hey guys,


Is there a way to tie the vertical loop helper function to scroll velocity or delta.y for example?


So having the helper function paused by default, and tapping into either of the above values to progress the timeline on scroll?


I have attached a demo of kind of what i'm after in terms of scroll (I don't intend to use the example for my work 😇)

See the Pen OJBxeMm?editors=0011 by jackkemm (@jackkemm) on CodePen


Essentially the columns would be paused, and animate in opposite directions using either of the above values to create the momentum/acceleration effect.




Link to comment
Share on other sites

Yep, pretty much anything is possible. You're wandering into the realm of paid consulting though because it's beyond the kind of custom help we can provide for free in these forums. It looks like you sorta got it working - what exactly isn't working the way you want? 

Link to comment
Share on other sites



Maybe the examples in this thread could provide some inspiration for what you're trying to do:


Hopefully this helps.

Happy Tweening!

Link to comment
Share on other sites

Hey @GreenSock,


Thanks for the reply. It's effectively just the velocity and giving it a slower momentum. I noticed that doing it this way will cause the vertical loop to go backwards on itself when it reaches a point.


I'm going for something like this but without the auto scrolling:

See the Pen oNGEvmw by cameronknight (@cameronknight) on CodePen


Hey @Rodrigo,


That's a perfect example thanks, but for this use case i'd like to try use the velocity to give the scroll some momentum rather than using timeScale.


Is there any hint you can provide to get going with using velocity and progressing the vertical loop timeline at all?




  • Like 1
Link to comment
Share on other sites



I managed to find a solution to my problem in the end in a GSAP Codepen!


This got me on the right tracks:

See the Pen zYPVoZV?editors=0010 by GreenSock (@GreenSock) on CodePen


Thanks for the help guys.




  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.