Delay first set() function call inside TimelineMax object

[twimbee]

Hello again,

 

I am having a bit of troubles delaying all the sequences of a timeline apparently when the first function call is a set() it doesn't work as I assume it would. I'd like to delay everything inside an event but it looks like the way I am approaching it doesn't work.

See the Pen eBZLVe?editors=0010 by twimbee (@twimbee) on CodePen

[Dipscom]

Hi twimbee,

 

A .set() method has no duration and is run immediately, I don't know the nitty gritty details but I know .set() methods run as soon as they're invoked, just like a .from() method. There are a couple of ways to go around it.

 

One is to add the delay in the .set() itself:

new TimelineMax({delay:2})
  .set('.box', {height:50, immediateRender:false}, 'a')
  .to('.box', 0.5, {height:250}, 'b') ;

Another is to turn the immediateRender property to false:

new TimelineMax()
 .set('.box', {height:50}, 'a+=2') // or .set('.box', {height:50}, 2)
 .to('.box', 0.5, {height:250}, 'b') ;

 

Here's a handy post, with video, that goes in detail about immediateRender.

 

http://greensock.com/immediateRender

[Jonathan]