Split Text Timeline Reverse Stucks in the Middle of Animation

[fonveton]

I'm trying to animate my main menu on hover. There is real and placeholder text for menu items and the animation is hide placeholder and show real text with split text stagger.

It works perfectly if you hover and release mouse slowly. But when you move your cursor over menu items fastly, some animations stuck in the middle of it.

What can I do to prevent this issue?

 

Here is the video of issue: https://streamable.com/7j8wgq

 

See the Pen ExbzyKm by manidar (@manidar) on CodePen

[OSUblake]

Hi fonventon,

 

You should create your timeline outside of your event handler, and then just play and reverse it. You will of course need to create a loop to do that...

 

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

 

[fonveton]

Thank you, that shorten my code alot