Triggering an animation by the end of another animation

Hi everyone!

I'm trying to create an animation that looks like a domino effect. There will be a grid of objects, lets say 10 x 10, and each object will have an animation that will follow on from the one next to it.

I want to be able to set the animation from each object to trigger immediately after the animation of another one ends, so I can create a ripple effect.

Does anyone have any ideas?


Hi Andy,

There's a couple of components on the Forge that will let you perform animations, as well as multiple SilkUI patterns, but I'm unaware of any that expose events or would allow you to to chain animations as they occur. If you're not averse to writing your own Javascript, the jQuery animate() function exposes a callback that will be executed once your animation is complete:

One of their code examples illustrates the arguments for the animate function, and the last one is the complete callback - you could chain multiple animates each nested inside their complete callback.