Motion Design with CSS Motion Design with CSS

Chaining Animations with Event Listeners

Rachel Nabors
Rachel Nabors
Award Winning Cartoonist

Animation stacking has it drawbacks. Individual segments cannot be looped and only one timing function can be applied. For more complex sequencing, Rachel recommends using the JavaScript animation API. The API includes events like animationstart, animationend, and animationiteration. These events can be used to trigger, modify, or sequence additional animations.

Get Unlimited Access Now