Need to set total duration, but not affect timeScal...

[Mr Pablo]

I know I can use "duration()" to set a total timeline duration, but by doing so, it changes the timeScale().

 

I need to be able to make an animation 20 seconds long, but it may only have 10 seconds worth of animation (leaving it static on screen for the remaining 10 seconds)

 

I have 2 animations in a timeline, both are seperate from each other and need different total durations.

 

Is there a way to add a "spacer" tween of sorts?

[GreenSock]

Sure, I'd say the easiest way would probably be to add a dummy "set" call that doesn't really do anything except take up space:

tl.set({}, {}, 20);

Notice the target is a generic object and the vars param is an empty object, so nothing really gets set/tweened, but nevertheless there's a zero-duration tween that gets dropped into the timeline at exactly 20 seconds. 

 

Does that help? 

[Mr Pablo]

Seems to do the job! for now

 

EDIT - failed It works for the first animation (i added it in after the first animations .fromTo() tweens) but the second time it didn't work - the 2nd animation played then straight away went back to the first (its on repeat).

[Carl]

Hi, not sure how you are building your timeline so that the "dead" space isn't consistently honored. 

 

Take a look at this codepen that uses Jack's suggestion:

http://codepen.io/GreenSock/pen/b18edad66583a400a1d479bcb79632c6

 

The timeline plays multiple times and it's duration()  is 5 seconds because of the dummy set() placed at a position of 5.

 

If you still have trouble, please fork and edit that codepen so that it illustrates how your version is breaking. Thanks