Is there simple way to create a linear.none ease but with a slight deceleration in the last 10%?
Something like this:
Without CustomEase plugin ideally
var split = new SplitText("#Headline_Copy", {type: "chars,words" , position:"absolute"});
I had a look through the docs and tried setting position:"absolute" , which amazingly fixes it in IE11, but ruins it in everything else:
Thanks for replying.
I'm sure it is an IE problem (Please when will they delete that thing), but the gap underneath appears to be the same size as a line of text , at least when I set the split to 'words'. Which makes me think there's might be a trick in gsap I've overlooked? Any ideas at all appreciated
Finally got round to using SplitText, but I am having a weird bug in IE11.
This is how the text looks like without initialising SplitText:
This is what happens after I add SplitText, as you can see there is a gap underneath:
It works fine in all other browsers, any clues? CodePen attached
Sure I will go down that route, I was just checking there wasn't a built-in method. GSAP usually tweens arrays automatically, but I realise this is more complex
Do you know how I can time the tweens of each word to match as if the sentence was being Tweened? Eg: the word IS would animate quicker than SOMETHING
By the way: I am not using SplitText for this
Here's a new method which depends on the whole string being grouped into spans, i'm nearly there:
https://codepen.io/friendlygiraffe/pen/qBaroKJ
The questions I have are: How can I make the timeline loop through the spans array and animate all the words at adjusted speeds? There is also a delay at the beginning. Thanks!
Thanks, that's great. But it's a dynamic thing. So the text has to be in one div
I probably should have specified this originally!
Updated the codepen: https://codepen.io/friendlygiraffe/pen/YzGZree
I know the TextPlugin is not supposed to support nested HTML tags, but I'm trying to tween the colours of a paragraph, which doesn't animate the styled word's letters individually.
Wondered if there was a way around this?
Unfortunately, I am not allowed to use SplitText for this project, otherwise I would have.
Thanks
I found this which animated SVG polygon points, could something similar be done but without the draggable functionality ? https://codepen.io/osublake/pen/QdbQjN