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

[glassbean]

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

Thanks,
G^

[Visual-Q]

You could use an onRepeat callback with a Yoyo

 

https://greensock.com/docs/v3/GSAP/Tween

 

 

See the Pen GRqWovb by Visual-Q (@Visual-Q) on CodePen

 

on an onComplete without a Yoyo

 

See the Pen wvWJMRW by Visual-Q (@Visual-Q) on CodePen

[GreenSock]

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?