Jump to content
GreenSock

celli

delay with TimelineMax

Moderator Tag

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hi,

 

I have two timelines, but I want one timeline to start after the first timeline, either with a delay or some other way. What is the best way to have multiple timelines and be able to set their start times ?

Link to comment
Share on other sites

I see how to add a delay to a second timeline now, by using this:

tl2.delay(4.9);

 

Is this the best approach to use ? And is it the best approach for nesting timelines as well ?

Link to comment
Share on other sites

Hi,

 

Adding hardcoded delays like the code you post might be a good idea for an extremely simple set of timelines. Sure if you got just two timelines is as simple as pie. But the more timelines you got in your project the complex it gets, because you have to manually set all the delays for all the timelines that need one.

 

The best recommended practice is, no matter how simple your project is, nest your timelines into a parent one, create labels and set their positions either relative to the previous instance or a label, or absolutely based on the parent timeline's time.

var master = new TimelineMax(),
    tl1 = new TimelineLite(),
    tl2 = new TimelineLite();

master
  .add(tl1)
  .add(tl2)//add tl2 right after tl1, tl2 will play as soon as tl1 is completed

//another choice
master
  .add(tl1)
  .add(tl2, "+=1")//add tl2 1 second after tl1, tl2 will play 1 second after tl1 is completed

//using labels
master
  .add(tl1)
  .add("label1")
  .add(tl2, "label1+=1")//add tl2 1 second after label1, tl2 will play 1 second after "label1"

Just yesterday Carl posted a new entry in GreenSock's blog about this:

 

http://greensock.com/position-parameter

 

Also check this video tutorial Carl made some time ago:

 

http://greensock.com/position-parameter

 

Rodrigo.

  • Like 3
Link to comment
Share on other sites

I couldn't say it any better than Rodrigo. Take his advice and I think you'll find yourself loving what you can do with timelines, nesting them, using the position parameter, etc. Have fun!

  • Like 1
Link to comment
Share on other sites

ahh, this is great info. thanks!

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×