This is an experimental technology
Because this technology's specification has not stabilized, check the compatibility table for usage in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the specification changes.
The Animation interface represents a single animation player and provides playback controls and a timeline for an animation node or source.
Constructor
Animation()- Creates a new
Animationobject instance.
Properties
Animation.currentTime- Is the current time of the animation if it is running, or
nullif the animation is paused.
Animation.effect- Is
Animation.finishedRead only- Returns
Animation.playStateRead only- Returns an enumerated value describing the playback state of an animation.
Animation.playbackRate- Returns or sets the playback rate of the animation.
Animation.readyRead only- Returns
Animation.startTime- Returns or sets the scheduled time when an animation's playback should begin.
Methods
Animation.cancel()- Clears
Animation.finish()- Seeks either end of an animation, depending on whether the animation is playing or reversing.
Animation.pause()- Suspends playing of an animation.
Animation.play()- Starts or resumes playing of an animation, or begins the animation again if it previously finished.
Animation.reverse()- Moves the animation backwards, stopping at the start of the animation.
Specifications
| Specification | Status | Comment |
|---|---|---|
| Web Animations The definition of 'Animation' in that specification. |
Working Draft | Initial definition |
Browser compatibility
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| Basic support | 39.0 [1] | 40.0 (40.0) [2] | No support | No support | No support |
| Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | (Yes) [1] | 40.0 (40.0) [2] | No support | No support | No support |
[1] Implemented as AnimationPlayer (interface name in an early version of the spec).
[2] Before Firefox 40, it was available as AnimationPlayer. In both cases, you need to set the preference dom.animations-api.core.enabled to be able to use it.