Having trouble with SplitText revert

[PawleyBoboli]

Hi Folks,

 

I have been trying to add a SplitText animation to my accordion menu but I cannot get the revert function to work, and apparently, it doesn't work in the GSAP example either.

 

In the tutorial video here:  http://www.greensock.com/splittext/  , at the 8:21 mark Carl shows how calling 

function allDone() {
    mySplitText.revert();
}

returns the animated string elements back to a single div.  However, in the CopePen example at: 

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

  the same function is used but the string is not being reverted back to a single div.  I am getting the same behavior in my own attempts.  I can't figure out why but hopefully someone here knows.

 

Additionally, is it possible to chain separate SplitText animations and stagger their starts?  I have tried chaining a few SplitText animations into a TimelineLight but not getting this to work.

 

Thanks so much for any info.

--Kevin

[GreenSock]

Sorry about the confusion - that sample was missing a parameter. If you look at the docs, it shows that after the vars parameter, there's "stagger" (0.01 in this case), then "position" (which is the one that's missing here), and THEN the "onCompleteAll" callback. I just updated the codepen, adding the position parameter (the default of "+=0"). 

 

And yes, you can absolutely chain animations together - TimelineLite gives you pretty much unlimited flexibility. You have total control of the placement of every animation. 

var tl = new TimelineLite();
tl.staggerFrom(...);
tl.staggerTo(...);
...

You can define a "position" parameter to control precisely where things get placed (see the docs at

 

Does that help?