Update color text (by chars) with scrolltrigger

[idiakite]

I'd like to update the text color when we scroll down but only chars by chars and not all the sentence in the same time.
It worked well when I tried word by word but not with chars. What I am missing ? Thanks in advance

See the Pen PoVEJMz by idrissdiakite (@idrissdiakite) on CodePen

[PointC]

That's not working because you have the same trigger, start time and duration for all the characters. You'd simply need a stagger to make this work.

See the Pen 9a4e6975199dfb94f824ed859306297b by PointC (@PointC) on CodePen

 

Just FYI - I'd look hard at SplitText as it makes this much easier and you won't have such a verbose HTML section. 

https://gsap.com/docs/v3/Plugins/SplitText/

 

Happy tweening.

 

[idiakite]

Thanks a lot @PointC I'll look into it for sure !

[Rodrigo]

Hi,

 

Following @PointC's great advice, this demo uses SplitText with ScrollTrigger:

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

 

Hopefully this helps.

Happy Tweening!