AnimationEvent
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The AnimationEvent interface represents events providing information related to animations.
Constructor
AnimationEvent()-
Creates an
AnimationEventevent with the given parameters.
Properties
Also inherits properties from its parent Event.
-
AnimationEvent.animationNameRead only -
Is a
DOMStringcontaining the value of theanimation-namethat generated the animation. -
AnimationEvent.elapsedTimeRead only -
Is a
floatgiving the amount of time the animation has been running, in seconds, when this event fired, excluding any time the animation was paused. For ananimationstartevent,elapsedTimeis0.0unless there was a negative value foranimation-delay, in which case the event will be fired withelapsedTimecontaining(-1 * delay). -
AnimationEvent.pseudoElementRead only -
Is a
DOMString, starting with'::', containing the name of the pseudo-element the animation runs on. If the animation doesn't run on a pseudo-element but on the element, an empty string:''.
Methods
Inherits methods from its parent, Event.
Specifications
Browser compatibility
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Internet Explorer | Opera | Safari | WebView Android | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | |
AnimationEvent |
43
1-70
|
12 |
6 |
10 |
30
15-57
12.1-15
12-15
|
9.1
4
|
43
≤37-70
|
43
18-70
|
6 |
30
14-49
12.1-14
12-14
|
9.3
3.2
|
4.0
1.0-10.0
|
AnimationEvent |
43 |
14 |
23 |
No |
No |
9.1
6
|
43 |
43 |
23 |
No |
9.3
6
|
4.0 |
animationName |
43 |
12 |
6 |
10 |
30 |
9 |
43 |
43 |
6 |
30 |
9 |
4.0 |
elapsedTime |
43 |
12 |
6 |
10 |
30 |
9 |
43 |
43 |
6 |
30 |
9 |
4.0 |
pseudoElement |
68 |
79 |
23 |
No |
No |
13.1 |
68 |
68 |
23 |
No |
13.4 |
10.0 |
See also
- Using CSS animations
- Animation-related CSS properties and at-rules:
animation,animation-delay,animation-direction,animation-duration,animation-fill-mode,animation-iteration-count,animation-name,animation-play-state,animation-timing-function,@keyframes.
© 2005–2021 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/AnimationEvent