Target only certain chars from splitText animation

[AdTheorent Creative]

Hi all,

 

I'm working on a project where I have a lot of .staggerTo & .staggerFrom split text typewriter style timelineMax animations. I have an instance where I'm animating out a full sentence but on the reverse I'd like to only animate back 3-5 characters. I know the text is split up into an array somewhere and I'm wondering what the best method of targeting the last few characters would be. Is this be possible?

 

Thanks!

 

(I've included a non-functioning codepen URL.. apologies, I've learned this stuff backwards using in GWD first and not hand coding so my timeline play call isn't correct --hopefully I'm illustrating the gist of what I'm trying to do)

See the Pen LXgXaz by atAlex (@atAlex) on CodePen

[Carl]

Hi and welcome to the GreenSock forums,

 

Yeah, you can use splice() to grab any number of elements from the end of the chars array that is created by SplitText.

 

 

//grab the last 3 characters and reverse them
var lastChars = myText.chars.splice(myText.chars.length-3,3).reverse();

 

Here is a simplified demo:

 

See the Pen mQzorB?editors=0010 by GreenSock (@GreenSock) on CodePen

 

Here is an explanation of splice()

http://www.tothenew.com/blog/javascript-splice-vs-slice/

 

[AdTheorent Creative]

Hi Carl,

 

This was super helpful! I'll reply further if I run into any other issues.

 

Thanks again!