onReverseComplete (setting Scope)

[jkellner 0 Likes (Newbie)]

I have a project that I am building and unbuilding cards to a screen based on User feedback. My goal is:

1. animate in the cards (TimeLine.staggerFrom)
2. user chooses new set
3. animate out the cards (using Reverse)
4. onReverseComplete (load the new set of cards)
5. Empty the container of cards
6. Append the new HTML
7. Animate in the new cards

 

But the issue is my reverse complete is firing before the timeline is complete... I am guessing it is happening when a child card completes, I would like it to happen when the whole timeline reverse complete

See the Pen GPbwzr?editors=1111 by jkellner (@jkellner) on CodePen

[RolandSoos 73 Likes (Contributor)]

Try to use the timeline's onReverseComplete event.

 

onReverseComplete on the stagger* callbacks will be fired on every subsequent tweens (for every box).

 

See the Pen QzXzXX?editors=0010 by mm00 (@mm00) on CodePen

 

[jkellner 0 Likes (Newbie)]

Boom!  I knew it was something simple... Thanks!

 

[mikel 4,774 Likes (Superhero)]

Hi @jkellner,

 

As a supplement to the note from @RolandSoos.
If you want to take a little break, use a delayedCall ()

 

See the Pen VqJgWB by mikeK (@mikeK) on CodePen

 

Happy tweening ...

Mikel