How do I use staggerFrom (SplitText) with version 3 of gsap?

[NubieHere]

I can't seem to figure out from the docs or by googling, what the syntax for using staggerFrom with SplitText (following the introduction video of SplitText).

 

I do embed gsap.min.js and SplitText.js in my document. But this:

 

let splitText = new SplitText('.ensomhed', {'type': 'words,chars'});
splitText.staggerFrom(splitText.chars, .8, {opacity: 0});

 

throws this error (as if gsap was not loaded – which is NOT the case):

 

Uncaught TypeError: (new SplitText(...)).staggerFrom is not a function

 

Someone know what I'm missing?

[NubieHere]

OK, I'm an idiot ... staggerFrom is not on the SplitText, but on the TweenLite ... sigh, getting a very strong coffee ... ; )

[Carl]

no, worries. we all make mistakes. 

 

Below is a demo from my FREE GSAP 3 Express Course which has an intro on SplitText and loads of info on staggers.

 

With GSAP 3, there is no need for staggerFrom() as stagger is now a property of all tweens.

 

See the Pen NWqYKYN by snorkltv (@snorkltv) on CodePen

 

If you are migrating to GSAP 3 or just starting out I think you will find the free course very useful

 

Carl

[NubieHere]

Thanks a lot ... I'll definitely check it out.