Scramble text multiline and in the same time

[bernard89]

Hello all, i'm new to gsap, i'm trying to adapt the scramble text plugin to make it as similar as possible to the one in the video i linked, only i noticed some limitations like putting the text on multiple lines and showing the finished words at the same time. Can anyone help me or recommend some other plugin?

Thanks

See the Pen dyQjPoY by tero-moi (@tero-moi) on CodePen.

[mvaneijgen]

Hi @bernard89 welcome to the forum!

 

Check it out I've used the position parameter to have all tweens start at the same time! That's all you need right? Hope it helps and happy tweening! 

 

See the Pen xxQJXqq?editors=0010 by mvaneijgen (@mvaneijgen) on CodePen.

[bernard89]

ok now go all together, thanks!

is it also possible to make them start with the smallest symbols and then they grow? like like the video?

[bernard89]

if you see in the video all the same letters start and then they change with other same letters, in the end they make up the word

eg: "aaaaaaa" "ccccccc" "final word"

Does the plugin allow to achieve this effect?

[Cassie]

I'm not sure I entirely understand but if you want to match the video exactly I'm afraid that would likely need a custom solution. There's a lot of randomness in scrambletext and if you want to specify which characters show at exactly which times you'd need more control.

This page shows the parameters that you have control over

https://gsap.com/docs/v3/Plugins/ScrambleTextPlugin

If you want to create a more custom solution, textplugin will give you more control, but you'll have to write all the logic yourself.

 

[bernard89]

ok i have understand, thank you!