Beispiel
Tun Sie etwas mit einem <div> Element , wenn ein CSS Übergang beendet ist :
// Code for Safari 3.1 to 6.0
document.getElementById("myDIV").addEventListener("webkitTransitionEnd",
myFunction);
// Standard syntax
document.getElementById("myDIV").addEventListener("transitionend",
myFunction); Versuch es selber " Definition und Verwendung
Die transitionend Ereignis tritt auf, wenn ein CSS Übergang abgeschlossen hat.
Hinweis: Wenn der Übergang vor der Fertigstellung entfernt wird, zB wenn die CSS - Übergang-Eigenschaft Eigenschaft entfernt wird, wird das transitionend Ereignis nicht ausgelöst.
Weitere Informationen über CSS Transitions finden Sie in unserem Tutorial auf CSS3 Transitions .
Browser-Unterstützung
Die Zahlen in der Tabelle geben Sie die erste Browser-Version, die das Ereignis vollständig unterstützt.
Zahlen, gefolgt von "WebKit", "moz" oder "o" geben Sie die erste Version, die mit einem Präfix gearbeitet.
| Event | |||||
|---|---|---|---|---|---|
| transitionend | 26.0 4.0 (webkitTransitionEnd) | 10.0 | 16.0 4.0 (mozTransitionEnd) | 6.1 3.1 (webkitTransitionEnd) | 12.1 10.5 (oTransitionEnd) |
Syntax
object.addEventListener("webkitTransitionEnd", myScript );
// Code for Safari 3.1 to 6.0
object .addEventListener("transitionend", myScript );
// Standard syntax
Hinweis: Die addEventListener () Methode wird nicht unterstützt in Internet Explorer 8 und frühere Versionen.
Technische Details
| Blasen: | ja |
|---|---|
| Es fällt eine Pauschale: | ja |
| Event-Typ: | TransitionEvent |
| DOM-Version: | Stufe 3 Veranstaltungen |
Verwandte Seiten
CSS Tutorial: CSS3 Transitions
CSS Referenz: CSS3 Übergang der Immobilie
CSS Referenz: CSS3 Transition-Immobilie
Ereignisobjekt