Nested Timelines from Function Returns

[dev-kp 12 Likes (Newbie)]

Hi,

 

Been trying to get this to work for a little while now, a bit stuck.

 

CodePen:

See the Pen jbMWxy by Dev-KP (@Dev-KP) on CodePen

 

Basically the individual animations work:

.add(aninIn(copy1, 20))

//.add(aninOut(copy1, 20))

 

When one of them is commented out the other will work perfectly, but having them both there seems to make them merge. 

I'm guessing it's something to do with the .set in the returned tiimelines?

 

 

If I am not mistaken the nested timelines should play one after another?

Or is this something for immediateRender?

 

Cheers

P

[dev-kp 12 Likes (Newbie)]

Seems changing the .set to .to with a 0.01 duration actually fixes the issue.

 

See the Pen WQobdQ?editors=101 by Dev-KP (@Dev-KP) on CodePen

[Dipscom 2,815 Likes (Superhero)]

Funnily enough, it was something we were discussing not long ago.

 

http://greensock.com/forums/topic/12494-question-about-when-css-props-are-set/#entry51978

 

The official is not known just yet but you have reached the current workaround.

[dev-kp 12 Likes (Newbie)]

Yup I did have a look at that post. The work around seems workable but a bit odd. If I build a normal timeline, with a bunch of add() and set() with out using nested timeline the set() seems to work correctly. But nested timelines run immediately, wonder if a call() function would cause the same issue?

 

Guess will be using the 0.01 duration fix for the time be. 

 

Cheers,

 

P

[dev-kp 12 Likes (Newbie)]

This seems to work as well. Pause the nested timelines and then play them in the global timeline.

 

See the Pen WQobdQ?editors=101 by Dev-KP (@Dev-KP) on CodePen

 

This is using set() 

 

P