determin1st

Hello, Is there a way to run onComplete function of all nested timelines after main timeline finished playing? I have a two areas at page - one is carousel list (left <- center/current -> right) and second is menu (div with buttons) which slide to left or right. I defined a drag event which unites two effects - carousel slide and menu slide. main timeline is controlled with .progress(X, true) function and after reaching 80% limit and dropping (mouseup), state changes and both effects need to be reset in their onComplete. The problem is that duration differs (first is 0.4, second is 0.6 - both start at the same time) and first effect doesn't fire onComplete after drop event plays main timeline - .play(null, false).

Hello Rodrigo, thanks for your workaround, but i really like non-imperative-declarative style.. i have a button with hover-gsap-TimelineLite tween-effect witch is invoked inside mouseover -> play(), and reversed inside mouseout -> reverse(). when this effect completes, onComplete creates a yoyo-tween which applies more animation to this button changing from the same value {scale} as in first effect. now, the need is to reverse yoyo-tween to the complete state of first effect and then, to continue reversing first TimelineLite. maybe i'm going the wrong way doing this [e1->e2, e1<-e2] animation. anyway, thanks for reading.

suppose, it would be much safer to change ease IF there were onReverse event..

while stopping yoyo-tween, how to return to it's first state smothly?

reverse() isn't called in yoyo:true case. so, if we have to stop the tween with yoyo, we need onReverse event. the code bloat happens at user side. not good.