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 propertyName Property
- HTML | DOM TransitionEvent elapsedTime Property
- Inline HTML Helper - HTML Helpers in ASP.NET MVC
- HTML | <html> xmlns Attribute
- HTML Course | Structure of an HTML Document
- HTML Course | Basics of HTML
- HTML | DOM HTML Object
- What is the difference between <html lang="en'> and <html lang="en-US'> ?
- HTML | <td> Tag
- HTML tr Tag
- ES6 | HTML DOM
- PHP vs HTML
- HTML | <!--...--> Tag
- Div Tag | HTML
- HTML | dl Tag
- HTML | dt Tag
- HTML | b Tag
- HTML | bdo Tag
- HTML | <rtc> Tag
- HTML | <q> 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 firstname.lastname@example.org. 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.