AutoAlpha que?

[NubieHere 13 Likes (Newbie)]

OK, back again after months and months of not using GSAP – learning everything over again.

 

I have a very simple case of wanting to animate in a line of text – starting with it NOT being visible AT ALL.

 

Now, I can't for the life of me figure out how to make this happen. I've tried setting the opacity to 0, fiddling around with 'to' and 'from', fiddling with AutoAlpha true/false, 0/1 and what not ... HOW can I simply make a string of text appear letter by letter using SplitText without the text showing up initially?

 

And by the way, Codepen suck as it won't let me 'replay' the pen above – what happened to the "run" button once there (as far as I remember) – I seem to have to reload the entire page to rerun it, seriously?

See the Pen LYOyQqW by blaasvaer (@blaasvaer) on CodePen

[mikel 4,775 Likes (Superhero)]

Hey @NubieHere,

 

Please look at the DOC autoAlpha

 

See the Pen OJOmvmq by mikeK (@mikeK) on CodePen

 

Happy tweening ...

Mikel

 

[NubieHere 13 Likes (Newbie)]

OK, and only NOW did I see you code ... thanks.

[NubieHere 13 Likes (Newbie)]

OK, problem seem to persist ... I cannot hide the element initially ... how do I do that?

 

Wouldn't I have to hide the element using css opacity to 0, and then – before animating it – unhide it? I had hoped GSAP would take care of that for me ... I thought that's what autoAlpha was also about.

[NubieHere 13 Likes (Newbie)]

OK, full of typos here ... sorry. And thanks.

[mikel 4,775 Likes (Superhero)]

 

Hey @NubieHere,

 

This blog post might help you: Quick Tip: Removing a Flash of Unstyled Content (FOUC)

 

Happy tweening ...

Mikel