Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<h1><a href="http://www.w3.org/TR/css3-transitions/#transition-events-" rel="nofollow noreferrer">W3C CSS Transitions Draft</a></h1> <blockquote> <p>The completion of a CSS Transition generates a corresponding DOM Event. An event is fired for each property that undergoes a transition. This allows a content developer to perform actions that synchronize with the completion of a transition.</p> </blockquote> <hr> <h2><a href="http://developer.apple.com/safari/library/documentation/InternetWeb/Conceptual/SafariVisualEffectsProgGuide/Transitions/Transitions.html" rel="nofollow noreferrer">Webkit</a></h2> <blockquote> <p>You can set a handler for a DOM event that is sent at the end of a transition. The event is an instance of WebKitTransitionEvent and its type is webKitTransitionEnd in JavaScript.</p> </blockquote> <pre><code>box.addEventListener( 'webkitTransitionEnd', function( event ) { alert( "Finished transition!" ); }, false ); </code></pre> <h2><a href="https://developer.mozilla.org/en/CSS/CSS_transitions#Detecting_the_completion_of_a_transition" rel="nofollow noreferrer">Mozilla</a></h2> <blockquote> <p>There is a single event that is fired when transitions complete. In Firefox, the event is <code>transitionend</code>, in Opera, <code>oTransitionEnd</code>, and in WebKit it is <code>webkitTransitionEnd</code>.</p> </blockquote> <h2><a href="http://www.opera.com/docs/specs/presto29/css/transitions/#events" rel="nofollow noreferrer">Opera</a></h2> <blockquote> <p>There is one type of transition event available. The <code>oTransitionEnd</code> event occurs at the completion of the transition.</p> </blockquote> <h2><a href="http://msdn.microsoft.com/en-us/library/ie/hh673535(v=vs.85).aspx#transitions_dom_events" rel="nofollow noreferrer">Internet Explorer</a></h2> <blockquote> <p>The <code>transitionend</code> event occurs at the completion of the transition. If the transition is removed before completion, the event will not fire.</p> </blockquote> <hr> <p><a href="https://stackoverflow.com/questions/5023514/how-do-i-normalize-css3-transition-functions-across-browsers">SO: How do I normalize CSS3 Transition functions across browsers?</a></p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload