This feature is well established and works across many devices and browser versions. It’s been available across browsers since August 2016.
The TransitionEvent() constructor returns a new TransitionEvent object, representing an event in relation with a transition.
new TransitionEvent(type) new TransitionEvent(type, options)
typeA string with the name of the event. It is case-sensitive and browsers set it to transitionrun, transitionstart, transitionend, or transitioncancel.
options OptionalAn object that, in addition of the properties defined in Event(), can have the following properties:
propertyName OptionalA string containing the name of the CSS property associated with the transition. It defaults to "".
elapsedTime OptionalA number giving 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, elapsedTime is 0.0 unless there was a negative value for animation-delay, in which case the event will be fired with elapsedTime containing (-1 * delay). It defaults to 0.0.
pseudoElement OptionalA string, defaulting 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 "".
A new TransitionEvent object.
| Specification |
|---|
| CSS Transitions> # dom-transitionevent-transitionevent> |
| Desktop | Mobile | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| Chrome | Edge | Firefox | Opera | Safari | Chrome Android | Firefox for Android | Opera Android | Safari on IOS | Samsung Internet | WebView Android | WebView on iOS | |
TransitionEvent |
27 | 14 | 23 | 15 | 76 | 27 | 23 | 15 | 76 | 2.0 | 4.4 | 76 |
transition, transition-delay, transition-duration, transition-property, transition-timing-function.
© 2005–2025 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