animacjastart Wydarzenie
Przykład
Zrób coś z elementem <div> po rozpoczęciu animacji CSS:
var x = document.getElementById("myDIV");
// Code for Chrome, Safari and Opera
x.addEventListener("webkitAnimationStart", myStartFunction);
// Standard syntax
x.addEventListener("animationstart", myStartFunction);
Definicja i użycie
Zdarzenie animationstart występuje, gdy rozpoczyna się odtwarzanie animacji CSS.
Aby uzyskać więcej informacji na temat animacji CSS, zapoznaj się z naszym samouczkiem dotyczącym animacji CSS3 .
Podczas odtwarzania animacji CSS mogą wystąpić trzy zdarzenia:
- Animationstart - występuje, gdy animacja CSS została uruchomiona
- Animationiteration - występuje, gdy animacja CSS jest powtarzana
- Animationend - występuje po zakończeniu animacji CSS
Obsługa przeglądarki
Liczby w tabeli określają pierwszą wersję przeglądarki, która w pełni obsługuje zdarzenie.
Liczby, po których następuje „webkit” lub „moz”, określają pierwszą wersję, która działała z prefiksem.
Event | |||||
---|---|---|---|---|---|
animationstart | 4.0 webkit | 10.0 | 16.0 5.0 moz |
4.0 webkit | 15.0 webkit 12.1 |
Uwaga: w przeglądarkach Chrome, Safari i Opera użyj prefiksu webkitAnimationStart.
Składnia
object.addEventListener("webkitAnimationStart", myScript); // Code for Chrome, Safari and Opera
object.addEventListener("animationstart", myScript); // Standard syntax
Uwaga: Metoda addEventListener() nie jest obsługiwana w programie Internet Explorer 8 i wcześniejszych wersjach.
Szczegóły techniczne
Bąbelki: | tak |
---|---|
Możliwość anulowania: | Nie |
Typ wydarzenia: | AnimacjaWydarzenie |
Wersja DOM: | Wydarzenia poziomu 3 |
Powiązane strony
Samouczek CSS: animacje CSS3
Dokumentacja CSS: Właściwość animacji CSS3
Odniesienie HTML DOM: Właściwość animacji stylu