GSAP Marque with Events

[TerraHQ]

Hey! I would like when:
mouseenter - > animation start with some kind of increment of speed, 
mouseleave -> animation stops slowly <- this is working using timeScale, but I dont know if that's the best solution.

Thanks!


 

See the Pen oNyereb by andresclua (@andresclua) on CodePen

[Rodrigo]

Hi,

 

Actually I don't think you need the onComplete callbacks in your mouse enter/leave event handlers, just tween the timeScale to 0 and 1 and that should be it. Also instead of creating the animation paused, set it's timescale to 0. This seems to work as you expect:

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

 

Also you should take a look at the Horizontal Endless Loop helper function:

https://greensock.com/docs/v3/HelperFunctions#loop

 

Let us know if you have more questions.

 

Happy Tweening!