Easy Tutorial
❮ Prop Nav Product Prop Style Quotes ❯

transitionend Event

Event Object

Example

Modify the style and text of a <div> element after CSS transition completes:


Definition and Usage

The transitionend event is fired when a CSS transition has completed.

Note: If the transition is removed before completion, such as when the CSS transition-property property is removed, the transition event will not be fired.

For more information on CSS transitions, see our CSS3 Transitions.


Browser Support

The numbers in the table specify the first browser version that fully supports the event.

Numbers prefixed with "webkit" or "moz" or "o" indicate the first version that supported the event with a prefix.

Event
transitionend 26.0 <br>4.0 as webkitTransitionEnd 10.0 16.0 <br>4.0 as mozTransitionEnd 6.1 <br>3.1 as webkitTransitionEnd 12.1 <br>10.5 as oTransitionEnd

Note: Safari versions 3.1 to 6.0 support this event with the webkitTransitionEnd prefix.


Syntax

Note: Internet Explorer 8 and earlier versions do not support the addEventListener() method.


Bubbles: Yes
Cancelable: Yes
--- ---
Event Type: TransitionEvent
--- ---

Related Pages

CSS Tutorial: CSS3 Transitions

CSS Reference: CSS3 Transition Properties

CSS Reference: CSS3 transition-property Property

❮ Prop Nav Product Prop Style Quotes ❯