goodwin74

Thank you very much OSUblake! I now realized that they add up, and the total duration is twice as long. Now I divided the "duration" and the "amount" in half and everything worked out!

Oh, I get it! Now I divided the duration in half and everything worked out. Here's how: tl.to(charsArr,{duration:0,y:'+='+(curObjText.size*2)}) .to(charsArr,{ease: "power1.out",duration:durationAnimS*0.5,y:'-='+(curObjText.size*2), stagger:{amount:durationAnimS*0.5}}). to(charsArr,{ease: "power1.in",delay:durationAnimM,duration:durationAnimE,y:'+='+(curObjText.size*2)}); Have I done the right thing? Now the animation takes 0.32 seconds, as it should be (durationAnimS = 0.32) Thank you very much!!!

var tl = gsap.timeline(); tl.to(charsArr,{duration:0,y:'+='+(curObjText.size*2)}) tl.to(charsArr,{ease: "power1.out",duration:durationAnimS,y:'-='+(curObjText.size*2), stagger:0.1}).duration(durationAnimS); tl.to(charsArr,{ease: "power1.in",delay:durationAnimM,duration:durationAnimE,y:'+='+(curObjText.size*2)}); durationAnimS = 0.32s But the animation is done in 2.4 seconds

charsArr = text.split(''); //We divide the text into characters Set amount = charsArr.length ? Or how to use it? I tried to do it, but the animation is now several times larger than it was

How to set the total duration of "stagger" equal to the duration of the animation? For example, if there is an unknown number of characters in the text, which is animated using "stagger". If you set "stagger" = 0.2s, and the animation duration is set to 1 second, then with 5 characters the animation will complete in 1 second. And if there are more characters, then the animation will last more than 1 second. How to make the animation always be 1 second, and "stagger" he calculated the time by dividing the duration of the animation by the number of characters? So to say, making an adaptive "stagger" that adapts to the duration of the animation.