Issue with SplitText Module

[Jim Tim]

Hello Team, 
we are facing three issues with the SplitText  Module.
Issue 1: The DOM created by SplitText is not placed in the same position as the original DOM

The Original DOM:

 

The DOM created by SplitText:

 

Issue 2: The Word split is not happening based on Whitespace.
The words "IS ALL" in the first list items are split like ["I", "S",  "AL",  "L"] the expected output is ["IS", "ALL"]
 

Issue 3: The Word "There" in the first list items is not underlined in the final output.

Kindly note that Note: the user edits all the dom, so we cannot change the DOM structure.

 

CLICK  the click here button to start the animation
CLICK the reset button to reset the animation and back to its original position.

 

See the Pen eYbZEJa by dajeme7838- (@dajeme7838-) on CodePen

[GreenSock]

Hi @Jim Tim. This isn't really something SplitText can do - you've got an extremely complicated edge case where you're nesting nodes, doing so within individual words, using archaic <font> tags, etc. and I don't really see a simple fix for you. The underline is disappearing because apparently browsers won't allow them for any elements with display: inline-block (only inline). But browsers won't allow you to apply transforms to elements with display: inline, so it's a bit of a catch-22.

 

So this is beyond the scope of help we can provide in the free forums, but you're welcome to contact us about paid consulting services. We might be able to custom-code something to accommodate the edge cases you're facing there with enough time and effort. I really wish I could think of an easy fix for you. 

 

I also noticed that you don't have a Club GreenSock membership, so SplitText isn't available to you outside of CodePen/Stackblitz - do you have membership under a different account?