The creation and completion of a CSS Transition result in a corresponding DOM Event. An event is fired for each property that undergoes a transition which gives the name of the property and the duration for which transition occurs. If the transition is not executed before completion the event will not fire.
- propertyName: Returns the name of the transition.
- elapsedTime: Returns the number of seconds a transition has been running.
- transitionend: The event occurs when a CSS transition has been completed.
- transitionstart: The event occurs when a CSS transition has started.
- for transitionend event:
- Google Chrome-26.0
- Internet Explorer-10.0
- Mozilla Firefox-16.0
- HTML | DOM TransitionEvent elapsedTime Property
- HTML | DOM TransitionEvent propertyName Property
- HTML Course | Structure of an HTML Document
- HTML | DOM HTML Object
- HTML Course | Basics of HTML
- HTML | <a> Tag
- PHP vs HTML
- HTML vs XML
- Div Tag | HTML
- HTML | dl Tag
- HTML | <dfn> Tag
- HTML | <kbd> Tag
- HTML | <td> Tag
- HTML tr Tag
- HTML | col Tag
Example-1: “transitionend” event
Example-2: “TransitionEvent” propertyName property.
If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to email@example.com. See your article appearing on the GeeksforGeeks main page and help other Geeks.
Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.