Start and repeat timeline X seconds in, repeat X seconds before end

[tin_soldier]

I'm attempting to make a seamless loop out of a timeline where there is a sequence of images stacking on top of each other and scaling.

My thinking is to repeat the last image and start the timeline at 1.3 seconds then set it to repeat 1.3 seconds early which is a good point to be able to loop.

 

I've tried

mainTimeline.time(1.3);

and

repeatDelay: -1.3,

but can't get either of these to work how I'd like. The negative repeatDelay seems to alter the length of the timeline and I don't know how to apply the time(1.3) to each repeat.

Any help appreciated.
 

See the Pen KKEyQZJ by 1976ltd (@1976ltd) on CodePen

[Toso]

I would recommend taking a good looook at this demo to create dynamic loops with staggers

 

See the Pen ExVEOPa by snorkltv (@snorkltv) on CodePen

 

 and what's better than a good demo? A good demo with a great lesson that walks you step by step 

 

 

[tin_soldier]

Thanks @Toso

I also found that post and tutorial earlier today which is quite helpful but I haven't been successful yet in adapting my animation to the concept. Everything I've done seems like it should work but the repeats don't do what I'd expect.

 

See the Pen NWJwYKJ by 1976ltd (@1976ltd) on CodePen

[GreenSock]

I would probably take a different approach, like with a recursive function: 

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

 

I think it's a bit more elegant and flexible in this scenario. 

[tin_soldier]

@GreenSock Wow, that's absolutely perfect. Thanks for that! Very elegant.