stagger How to modify GSAP Stagger Loop starting point

[putraaa]

Hello,

I am new with GSAP and here I have a stagger loop that looks like a shockwave. The animations works like what I expected, but now I want to modify it so at the start there is no blank side and the loop run with 100% progress. 
previously, I try it using this method

wave.progress(1);

but, that's not working as I expected.

Here's the demo to understands my point.

See the Pen PovmEOj by bayu-putraa (@bayu-putraa) on CodePen.

[mvaneijgen]

Hi @putraaa welcome to the forum!

 

If I understand you correctly you want to create an animation, but jump it to a point so that the animation is already going instead of it having to start from 0. That's sounds like the perfect use case for .seek() https://gsap.com/docs/v3/GSAP/Timeline/seek(). I've installed GSDevTools to see what time looked good and used that in the .seek() function. 

 

Sounds boring, but I really recommend just browsing through the docs, you'll be surprised how much is already thought off that you didn't even think you'll needed! Hope it helps and happy tweening! 

 

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

[putraaa]

Awesome! I didn't know that before. That will be new insight for me also, thanks for your solution!