SplitText and MotionPath displays text in reverse

[Separator 3 Likes (Newbie)]

Hi there,

Im using MotionPath plugin to animate a text through a path and SplitText to split the text into characters but as you see it displays the text in reverse. For example when i write "Gsap" i see "pasG". 

I think the title and the codepen is self explanatory. 

How can i fix this issue?

See the Pen MWQGEzR by Separator (@Separator) on CodePen

[PointC 14,185 Likes (Superhero)]

    stagger: {
        each: -0.15,
        repeat: -1,
    },

Happy tweening.

 

[Separator 3 Likes (Newbie)]

Oh, that was easy!

However i noticed another issue. 

Its not separating the words!

I edited the codepen.

[Cassie 5,136 Likes (Superhero)]

The words are just divs so you can style them however you like! 🥳

Maybe pop some padding on the right of them

 

#split > * {
  padding-right:0.4rem;
}