TransitionEvent()
Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.
The TransitionEvent() constructor returns a newly created TransitionEvent, representing an event in relation with an transition.
Syntax
transitionEvent = new TransitionEvent(type, {propertyName: aPropertyName, elapsedTime : aFloat, pseudoElement: aPseudoElementName});
Arguments
The TransitionEvent() constructor also inherits arguments from Event().
- type
-
Is a
DOMStringrepresenting the name of the type of theTransitionEvent. It is case-sensitive and can only be:'transitionend'. -
propertyNameOptional -
Is a
DOMStringcontaining the value of theproperty-nameCSS property associated with the transition. It defaults to"". -
elapsedTimeOptional -
Is
floatgiving the amount of time the animation has been running, in seconds, when this event fired, excluding any time the animation was paused. For an"animationstart"event,elapsedTimeis0.0unless there was a negative value foranimation-delay, in which case the event will be fired withelapsedTimecontaining(-1 * delay). It defaults to0.0. -
pseudoElementOptional -
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:""``.It defaults to"".
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 | |
TransitionEvent |
27 |
79 |
23 |
No |
15 |
No |
≤37 |
27 |
23 |
14 |
No |
2.0 |
See also
- Using CSS transitions
- CSS properties:
transition,transition-delay,transition-duration,transition-property,transition-timing-function.
© 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/TransitionEvent/TransitionEvent