timeline does not work consistently

[Alatr]

Sorry for my English, who can tell why master timeline it does not work consistently, what am I doing wrong,

 

i expect in first step, box will open then close, but  i dont see open step

See the Pen eYpEByv?editors=1011 by dima-lukyanov (@dima-lukyanov) on CodePen

[ZachSaucier]

Hey Alatr and welcome to the GreenSock forums.

 

What is not working consistently about the demo that you shared?

 

I think it would be helpful if you described what you are trying to accomplish. Your code doesn't  make that clear to me.

[Alatr]

7 minutes ago, ZachSaucier said:

Hey Alatr and welcome to the GreenSock forums.

 

What is not working consistently about the demo that you shared?

i expect in first step, box will open then close, but  i dont see open step

[ZachSaucier]

2 minutes ago, Alatr said:

i expect in first step, box will open then close, but  i dont see open step

Thanks, I understand now. Thanks for a clear demo!

 

Let me explain what is going on:

1. You create a timeline a1 that is paused and the playhead is at time 0.
2. You add that timeline to a master timeline.
3. You then attempt to add the same timeline a second time to the master timeline but this time in the reverse direction.

All of the above happens when the master timeline is initialized.

 

Since both times you are referring to the same timeline object, the timeline's (a1's) playhead is changed to be at the end and going in the reverse direction when the master timeline's gets to where it should play a1 the first time. Thus there's nothing to play. So it moves on to the second (reversed) timeline and plays that.

 

To do what you are wanting to do, you should create two timelines: One to animate it in, one to animate it out. I would probably use a .call() to make sure the timeline isn't affected until the correct time comes. 

See the Pen gOaxmvv?editors=0010 by GreenSock (@GreenSock) on CodePen

 

Please let me know if you have questions.

[Alatr]

1 hour ago, ZachSaucier said:

Thanks, I understand now. Thanks for a clear demo!

 

Let me explain what is going on:

1. You create a timeline a1 that is paused and the playhead is at time 0.
2. You add that timeline to a master timeline.
3. You then attempt to add the same timeline a second time to the master timeline but this time in the reverse direction.

All of the above happens when the master timeline is initialized.

 

Since both times you are referring to the same timeline object, the timeline's (a1's) playhead is changed to be at the end and going in the reverse direction when the master timeline's gets to where it should play a1 the first time. Thus there's nothing to play. So it moves on to the second (reversed) timeline and plays that.

 

To do what you are wanting to do, you should create two timelines: One to animate it in, one to animate it out. I would probably use a .call() to make sure the timeline isn't affected until the correct time comes. 

 

 

 

Please let me know if you have questions.

thank you so much, you really helped, great explanation