This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The TransitionEvent interface represents events providing information related to transitions.

Constructor

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

Properties

Also inherits properties from its parent Event.

TransitionEvent.propertyName Read only
Is a DOMString containing the name CSS property associated with the transition.
TransitionEvent.elapsedTime Read only
Is 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
Is a DOMString, 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: ''.

Methods

Also inherits properties from its parent Event.

TransitionEvent.initTransitionEvent()
Initializes a TransitionEvent created using the deprecated Document.createEvent("TransitionEvent") method.

Specifications

Specification Status Comment
CSS Transitions
The definition of 'TransitionEvent' in that specification.
Working Draft Initial definition.

Browser compatibility

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidiOS SafariSamsung Internet
Basic support
Experimental
Chrome Full support YesEdge Full support YesFirefox Full support 4IE Full support 10Opera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
TransitionEvent() constructor
Experimental
Chrome Full support YesEdge No support NoFirefox Full support 23IE No support NoOpera Full support YesSafari No support NoWebView Android Full support YesChrome Android Full support YesEdge Mobile No support NoFirefox Android Full support 23Opera Android Full support YesSafari iOS No support NoSamsung Internet Android ?
animationName
Experimental
Chrome Full support YesEdge Full support YesFirefox Full support 4IE Full support 10Opera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
propertyName
Experimental
Chrome ? Edge ? Firefox ? IE ? Opera ? Safari ? WebView Android ? Chrome Android ? Edge Mobile ? Firefox Android ? Opera Android ? Safari iOS ? Samsung Internet Android ?
elapsedTime
Experimental
Chrome Full support YesEdge Full support YesFirefox Full support 4IE Full support 10Opera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesEdge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
pseudoElement
Experimental
Chrome Full support YesEdge No support NoFirefox Full support 23IE No support NoOpera Full support YesSafari No support NoWebView Android Full support YesChrome Android Full support YesEdge Mobile No support NoFirefox Android Full support 23Opera Android Full support YesSafari iOS No support NoSamsung Internet Android ?
initTransitionEvent
DeprecatedNon-standard
Chrome No support No
Notes
No support No
Notes
Notes Removal version unknown.
Edge Full support YesFirefox No support 6 — 23IE Full support 10Opera No support No
Notes
No support No
Notes
Notes Removal version unknown.
Safari Full support YesWebView Android No support No
Notes
No support No
Notes
Notes Removal version unknown.
Chrome Android No support No
Notes
No support No
Notes
Notes Removal version unknown.
Edge Mobile Full support YesFirefox Android No support 6 — 23Opera Android No support No
Notes
No support No
Notes
Notes Removal version unknown.
Safari iOS Full support YesSamsung Internet Android ?

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
Experimental. Expect behavior to change in the future.
Experimental. Expect behavior to change in the future.
Non-standard. Expect poor cross-browser support.
Non-standard. Expect poor cross-browser support.
Deprecated. Not for use in new websites.
Deprecated. Not for use in new websites.
See implementation notes.
See implementation notes.

See also

Document Tags and Contributors

Contributors to this page: ngyikp, fscholz, jpmedley, erikadoyle, Jeremie, teoli, Noitidart
Last updated by: ngyikp,