Übergangsereignis _
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);
Definition und Verwendung
Das Ereignis transitionend tritt auf, wenn ein CSS-Übergang abgeschlossen ist.
Hinweis: Wenn der Übergang vor der Fertigstellung entfernt wird, zB wenn die Eigenschaft transit -property von CSS entfernt wird, wird das Ereignis transitionend nicht ausgelöst.
Weitere Informationen zu CSS-Übergängen finden Sie in unserem Tutorial zu CSS3-Übergängen .
Browser-Unterstützung
Die Zahlen in der Tabelle geben die erste Browserversion an, die das Ereignis vollständig unterstützt.
Zahlen gefolgt von "webkit", "moz" oder "o" geben die erste Version an, die mit einem Präfix funktioniert hat.
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 Methode addEventListener() wird in Internet Explorer 8 und früheren Versionen nicht unterstützt.
Technische Details
Bläschen: | ja |
---|---|
kündbar: | ja |
Ereignistyp: | Übergangsereignis |
DOM-Version: | Ereignisse der Ebene 3 |
Verwandte Seiten
CSS-Tutorial: CSS3-Übergänge
CSS-Referenz: CSS3-Übergangseigenschaft
CSS-Referenz: CSS3-Eigenschaft transit-property