SplitText and mouse events

[Sixela]

Hello,

 

I'm using the SplitText plugin so I can make an animation that fills the letters from left to right when the mouse cursor hovers over the sentence.

 

My issues:
#1: Letter filling is not smooth.

#2: On cursor enter/exit events, padding is broken. Events are lost or out of sync.

After many days spent on this animation, I ask you to allow us to learn and move forward!

 

Thanks,

Sixela

See the Pen jOaGRGE by SixelaNr (@SixelaNr) on CodePen

[OSUblake]

Hi Sixela,

 

As we state in the forum guidelines we don't have the resources to help with logic problems. If you have a GSAP-specific question, we'd be more than happy help out with those.

[mikel]

Hey @Sixela,

 

-webkit-text-stroke: This feature is non-standard and can lead to irritation (uncommend JS line 11).

Here is a simple example using 'text-stroke' and alternatively SVG text.

 

See the Pen bGYYgXm??editors=0110 by mikeK (@mikeK) on CodePen

 

Happy tweening ...

Mikel