Jump to content

Search In
  • More options...
Find results that contain...
Find results in...

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

Go to solution Solved by GreenSock,

Recommended Posts


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

Link to comment
Share on other sites

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? 

  • Like 1
Link to comment
Share on other sites

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()?

Link to comment
Share on other sites

  • Solution

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? 

  • Thanks 1
Link to comment
Share on other sites

@GreenSock  Thanks, Jack!

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

  • Thanks 1
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.