Tweens the text content of a DOM element, replacing it one character at a time (or one word at a time if you set the delimiter
to " " (a space) or you can even use a custom delimiter). So when the tween is finished, the DOM element's text has been completely replaced. This also means that if you rewind/restart the tween, the text will be reverted. Here is a simple example of replacing the text in yourElement
:
//replaces yourElement's text with "This is the new text" over the course of 2 seconds TweenLite.to(yourElement, 2, {text:"This is the new text", ease:Linear.easeNone});
If you'd like to use a different delimiter so that instead of replacing character-by-character, it gets replaced word-by-word, just pass an object with configuration properties like this:
//replaces word-by-word because the delimiter is " " (a space) TweenLite.to(yourElement, 2, {text:{value:"This is the new text", delimiter:" "}, ease:Linear.easeNone});
You can even add a new css class to the new text as it comes in. Learn more in the TextPlugin documentation.