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

The Animation interface of the Web Animations API represents a single animation player and provides playback controls and a timeline for an animation node or source.


Creates a new Animation object instance.


The current time value of the animation in milliseconds, whether running or paused. If the animation lacks a timeline, is inactive or hasn't been played yet, its value is null.
Gets and sets the AnimationEffectReadOnly associated with this animation. This will usually be a KeyframeEffect object.
Animation.finished Read only
Returns the current finished Promise for this animation.
Gets and sets the String used to identify the animation.
Animation.pending Read only
Indicates whether the animation is currently waiting for an asynchronous operation such as initiating playback or pausing a running animation.
Animation.playState Read only
Returns an enumerated value describing the playback state of an animation.
Gets or sets the playback rate of the animation.
Animation.ready Read only
Returns the current ready Promise for this animation.
Gets or sets the scheduled time when an animation's playback should begin.
Gets or sets the timeline associated with this animation.

Event handlers

Gets and sets the event handler for the cancel event.
Gets and sets the event handler for the finish event.


Clears all keyframeEffects caused by this animation and aborts its playback.
Seeks either end of an animation, depending on whether the animation is playing or reversing.
Suspends playing of an animation.
Starts or resumes playing of an animation, or begins the animation again if it previously finished.
Reverses playback direction, stopping at the start of the animation. If the animation is finished or unplayed, it will play from end to beginning.
Sets the speed of an animation after first synchronizing its playback position.


Specification Status Comment
Web Animations
The definition of 'Animation' in that specification.
Working Draft Initial definition

Browser compatibility

FeatureChromeEdgeFirefoxInternet ExplorerOperaSafari
Basic support


39 — 441

?48 No26 No
Animation() constructor61 ?482 No ? No
cancel39 ?48 No26 No
currentTime39 ?48 No26 No
effect No ?482 3 No No No
finish39 ?48 No26 No
finished No ?482 No No No
id50 ?48 No37 No
oncancel50 ?48 No37 No
onfinish39 ?48 No26 No
pause39 ?48 No26 No
pending No ?594 No No No
play39 ?48 No26 No
playbackRate39 ?48 No26 No
playState395 ?486 No265 No
ready No ?482 No No No
reverse39 ?48 No26 No
startTime39 ?48 No26 No
timeline No ?482 No No No
FeatureAndroid webviewChrome for AndroidEdge mobileFirefox for AndroidOpera AndroidiOS SafariSamsung Internet
Basic support


39 — 441


39 — 441

?4826 No ?
Animation() constructor6161 ?482 ? No ?
cancel3939 ?4826 No ?
currentTime3939 ?4826 No ?
effect No No ?482 3 No No ?
finish3939 ?4826 No ?
finished No No ?482 No No ?
id5050 ?4837 No ?
oncancel5050 ?4837 No ?
onfinish3939 ?4826 No ?
pause3939 ?4826 No ?
pending No No ?594 No No ?
play3939 ?4826 No ?
playbackRate3939 ?4826 No ?
playState395395 ?486265 No ?
ready No No ?482 No No ?
reverse3939 ?4826 No ?
startTime3939 ?4826 No ?
timeline No No ?482 No No ?

1. Supported as AnimationPlayer.

2. From version 48: this feature is behind the dom.animations-api.core.enabled preference (needs to be set to true). To change preferences in Firefox, visit about:config.

3. This property is supported in Firefox 48 but is read-only. It became writable in Firefox 51.

4. Prior to version 59, the pending status was reported by a "pending" value returned from Animation.playState.

5. Before Chrome 50/Opera 37, this property returned idle for an animation that had not yet started. Starting with Chrome 50/Opera 37, it shows paused.

6. Prior to Firefox 59, this property returned pending for Animations with incomplete asynchronous operations but as of Firefox 59 this is indicated by the separate Animation.pending property. This reflects recent changes to the specification.

Document Tags and Contributors

 Last updated by: chrisdavidmills,