Loop timeline

[marcusfriberg]

Hi,

 

I'm quite new to GSAP and I wonder what the easiest way to loop a timelineLite would be?

I've managed to loop separate tweens inside the timeline but not the whole timeline.

 

TIA!

[GreenSock]

Well, the easiest thing would probably be to use a TimelineMax instead of a TimelineLite because it supports the "repeat" property:

var tl = new TimelineMax({repeat:2});

...

And you can even set a repeatDelay, and/or set it to yoyo (back and forth). 

 

But to answer your question, if you're using TimelineLite, you could use an onComplete to then restart() the timeline:

var tl = new TimelineLite({onComplete:function() {
    this.restart();
});

Does that help?

[optimisedEnergy]

Well, the easiest thing would probably be to use a TimelineMax instead of a TimelineLite because it supports the "repeat" property:

var tl = new TimelineMax({repeat:2});

...

And you can even set a repeatDelay, and/or set it to yoyo (back and forth). 

 

But to answer your question, if you're using TimelineLite, you could use an onComplete to then restart() the timeline:

var tl = new TimelineLite({onComplete:function() {
    this.restart();
});

Does that help?

Thanks for posting this response. I just used it on one of my projects.

[sjoerdoudman]

Nice! Small syntax error tho... so use

var tl = new TimelineLite({onComplete:function() {
    this.restart()}
});