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() constructor of the Web Animations API returns a new Animation object instance.
Syntax
var animation = new Animation([effect][, timeline]);
Parameters
effectOptional- The target effect, as an object based on the
AnimationEffectReadOnlyinterface, to assign to the animation. Although in the future other effects such asSequenceEffects orGroupEffects might be possible, the only kind of effect currently available isKeyframeEffect. This can benull(which is the default) to indicate that there should be no effect applied. timelineOptional- Specifies the
timelinewith which to associate the animation, as an object of a type based on theAnimationTimelineinterface. Currently the only timeline type available isDocumentTimeline, but in the future there my be timelines associated with gestures or scrolling, for example. The default value isDocument.timeline, but this can be set tonullas well.
Examples
In the Follow the White Rabbit example, the Animation() constructor is used to create an Animation for the rabbitDownKeyframes using the document's timeline:
var rabbitDownAnimation = new Animation(rabbitDownKeyframes, document.timeline);
Specifications
| Specification | Status | Comment |
|---|---|---|
| Web Animations The definition of 'Animation()' in that specification. |
Working Draft | Editor's draft. |
Browser compatibility
| Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| Basic support | No support | 48 (48)[1] | No support | No support | No support |
| Feature | Android | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|
| Basic support | No support | 48.0 (48) [1] | No support | No support | No support |
[1] The Web Animations API is only enabled by default in Firefox Developer Edition and Nightly builds. You can enable it in release builds by setting the preference dom.animations-api.core.enabled to true, and can disable it in any Firefox version by setting this preference to false.