This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

An animationcancel event is fired when a CSS Animation unexpectedly aborts. In other words, any time it stops running without sending an animationend event). This might happen when the animation-name is changed such that the animation is removed, or when the animating node is hidden using CSS. Therefore, either directly or because any of its containing nodes are hidden.

An event handler for this event can be added by setting the onanimationcancel property, or using addEventListener().

General info

Interface AnimationEvent
Bubbles Yes
Cancelable No
Targets Animation
Default Action None


This event implements the properties of AnimationEvent.


This event implements the methods of AnimationEvent.


Specification Status Comment
CSS Animations Working Draft Initial definition

Browser compatibility

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Feature Chrome Firefox (Gecko) Edge Internet Explorer Opera Safari (WebKit)
Basic support No support 54 (54) ? ? ? ?
Feature Android Android Webview Firefox Mobile (Gecko) Firefox OS IE Mobile Opera Mobile Safari Mobile Chrome for Android
Basic support ? No support 54.0 (54) ? ? ? ? No support

See also

Document Tags and Contributors

Contributors to this page: Sebastianz, mfluehr, david_ross, mantaroh, Sheppy
Last updated by: Sebastianz,