Help us test MDN's new front-end: https://discourse.mozilla.org/t/help-us-test-mdns-new-react-front-end-beta/42593

Os nossos voluntários ainda não traduziram este artigo para Português (Europeu). Junte-se a nós e ajude-nos a fazer o trabalho!
Pode também ler o artigo em English (US).

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: ''.

Types of TransitionEvent

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, when it is added to a set of running transitions, though not nessarilty started
transitionstart
An Event fired when a CSS transition has started transitioning.

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 AndroidSafari on iOSSamsung Internet
TransitionEvent
Experimental
Chrome Full support 27
Full support 27
No support 2 — 71
Prefixed
Prefixed Implemented with the vendor prefix: WebKit
Edge Full support YesFirefox Full support 4IE Full support 10Opera Full support YesSafari Full support YesWebView Android Full support Yes
Full support Yes
No support ? — 71
Prefixed
Prefixed Implemented with the vendor prefix: WebKit
Chrome Android Full support 27
Full support 27
No support 18 — 71
Prefixed
Prefixed Implemented with the vendor prefix: WebKit
Edge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
TransitionEvent() constructor
Experimental
Chrome Full support 27Edge No support NoFirefox Full support 23IE No support NoOpera Full support YesSafari No support NoWebView Android Full support YesChrome Android Full support 27Edge Mobile No support NoFirefox Android Full support 23Opera Android Full support YesSafari iOS No support NoSamsung Internet Android ?
animationName
Experimental
Chrome No support NoEdge Full support YesFirefox Full support 4IE Full support 10Opera Full support YesSafari Full support YesWebView Android No support NoChrome Android No support NoEdge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
propertyName
Experimental
Chrome Full support 2Edge Full support 12Firefox Full support YesIE ? Opera Full support YesSafari Full support 6WebView Android Full support YesChrome Android Full support 18Edge Mobile ? Firefox Android Full support YesOpera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
elapsedTime
Experimental
Chrome Full support 2Edge Full support 12Firefox Full support 4IE Full support 10Opera Full support YesSafari Full support 6WebView Android Full support YesChrome Android Full support 18Edge Mobile Full support YesFirefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android ?
pseudoElement
Experimental
Chrome Full support 2Edge No support NoFirefox Full support 23IE No support NoOpera Full support YesSafari Full support 6WebView Android Full support YesChrome Android Full support 18Edge 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 12Firefox 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.
Requires a vendor prefix or different name for use.
Requires a vendor prefix or different name for use.

See also

Etiquetas do documento e contribuidores

Contribuidores para esta página: mdnwebdocs-bot, estelle, ngyikp, fscholz, jpmedley, erikadoyle, Jeremie, teoli, Noitidart
Última atualização por: mdnwebdocs-bot,