how to use splittext revert() properly for each line?

[AsKadir 34 Likes (Newbie)]

Hello,

I have an issue with revert(), I splitted all elements with class .splittext  two times to lines,

so it's simple animation and everything is working, but I want to revert() every line on animation complete.

My questions is - is it possible to target Splittext of every line? I mean something like this.SplitTextVar.revert().

 

Thanks in advance!

See the Pen mdWpdLq by ChicagoJostik (@ChicagoJostik) on CodePen

[GreenSock 16,300 Likes (Superhero)]

Can you explain why you want to revert each line? I mean it doesn't really make sense to revert line-by-line because that wouldn't actually be a reversion. When you revert() a SplitText, it puts all the original text back where it was (ALL of it). Doing that one line at a time would necessitate that the lines are still split up, thus it's not a revert(). See what I mean? 

 

What's your goal exactly? 

[AsKadir 34 Likes (Newbie)]

24 minutes ago, GreenSock said:

What's your goal exactly? 

I just want to make text responsive on window resize after animation was done. So visible lines will be responsive, about invisible it doesn't matter. right? Or should I make it in another way? It's actually will be dynamic, the user can add animation to whatever text he/she wants by clicking the button in a WordPress site builder.

Can you give me advice, please? I understand that it bad practice what I'm doing, but should I just give up with revert()?

[GreenSock 16,300 Likes (Superhero)]

If I understand your goal correctly, here's a fork that reverts things after all the text has finished animating in, and it also is responsive so that when the screen gets resized things will adjust: 

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

 

Does that help? 

[AsKadir 34 Likes (Newbie)]

@GreenSock  Thanks, Jack!

I see what you've done, it's great!