TransitionEvent

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨July 2015⁩.

The TransitionEvent interface represents events providing information related to transitions.

Constructor

TransitionEvent(): Creates a TransitionEvent event with the given parameters.

Also inherits properties from its parent Event.

TransitionEvent.propertyName Read only: A string containing the name CSS property associated with the transition.
TransitionEvent.elapsedTime Read only: A float giving the amount of time the transition has been running, in seconds, when this event fired. This value is not affected by the transition-delay property.
TransitionEvent.pseudoElement Read only: A string, starting with ::, containing the name of the pseudo-element the animation runs on. If the transition doesn't run on a pseudo-element but on the element, an empty string: ''.

transitioncancel: An Event fired when a CSS transition has been cancelled.
transitionend: An Event fired when a CSS transition has finished playing.
transitionrun: An Event fired when a CSS transition is created (i.e., when it is added to a set of running transitions), though not necessarily started.
transitionstart: An Event fired when a CSS transition has started transitioning.