Jump to content


how to stop/pause a looping animation but ease into its final state/position

Recommended Posts

Hi There,

So I have a few looping animations (for example the one below) running through a larger animation.


TweenMax.fromTo("#beam", 1, {x:-50}, {x:400, ease:Linear.easeNone, repeat:-1});

At a certain point I want all the animations to stop but rather than just suddenly freeze I want them to ease to a final position, is this possible?

BTW I know I can use pause() to stop the animation but that causes everything to  stop suddenly


Link to comment
Share on other sites

If I understand your question correctly, here are two options: 

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


I wasn't sure if you just wanted ALL of the tweens to gradually STOP at the same time (not necessarily complete) or if you actually did want to force each and every one to completion. I updated things to use the modern syntax too. 


Does that help? 

  • Like 3
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.