Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
spacewindow

Start paused timeline from other timeline

Recommended Posts

Hi team,

 

this should be an easy one.

 

I have two timelines  the main timeline (mainTL) and a separate 'loop' timeline (overTL), which is paused, but not added to the main Timeline.

 

I want to cue overTL to start at a specific point on the main timeline. But I can't find what the syntax is to do this – just to move ahead was forced to use the onComplete callback to play 'overTL'.

var overTL = new TimelineMax({paused: true, repeat: -1});
var mainTL = new TimelineMax();

overTL
.to('#element', 1, {property:value})
(etc...);

// MY FUNCTION FOR PLAYING IT so I can use it from mainTL

function playIt(timeline, offset){
    timeline.play(offset);
}

mainTL
.set('#neon', {scale: 0.1, transformOrigin: 'center center'}, 'startDust')
// CUE overTL at this point
.set({}, {onComplete: playIt, onCompleteParams:[overTL, 0]}, 'startDust')
.to('#neonfade', 1, {opacity: 0},'startDust+=0.3')

(mainTL continues ...);

I created a function to do it, but just wondered if there is a more straightforward way to get this working in Greensock? There must be!! Kind of like what I used to do in flash where you would start a movieClip loop at a specific point in your main animation.

 

I would like to be able to completely cue this timeline from the main timeline as needed – pause, reverse, seek etc. But obviosuly don't want to have to write a custom function for each of these if its already part of the plugin.

 

Sorry I'm sure this must be obvious, thanks.

Link to post
Share on other sites

Hi spacewindow :)

 

you can simply call your functions where you want in timelines :

mainTl
  .to( obj , 1 , {} )
  .to( obj , 1 , {} , 'label' )
  .add( function(){ anotherTl.play() } , 'label' ) // start/run functions and tweens with same label at the same time
  .to( obj , 1 , {} )
  .to( obj , 1 , {} , 'label2' )
  .add( function(){ anotherTl.pause() } , 'label2' )
  • Like 1
Link to post
Share on other sites

Perfect, thanks once again Diaco. I tried using .call() to do this previously, but it doesn't have the position parameter that .add() has. That was my issue.

Link to post
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.

×