Zdarzenie animationstart

Zdarzenia DOM Zdarzenie AnimationEvent

Definicja i użycie

Zdarzenie animationstart występuje, gdy animacja CSS zaczyna się odtwarzać.

Aby uzyskać więcej informacji na temat animacji CSS, zapoznaj się z naszym Tutorial animacji CSS3.

Podczas odtwarzania animacji CSS może wystąpić trzy zdarzenia:

  • animationstart - Zdarzenie wywoływane, gdy animacja CSS zaczyna się odtwarzać
  • animationiteration - Zdarzenie wywoływane, gdy animacja CSS jest powtarzana
  • animationend - Zdarzenie wywoływane, gdy animacja CSS jest zakończona

Przykład

Rob coś z elementem <div>, gdy animacja CSS zaczyna się odtwarzać:

var x = document.getElementById("myDIV");
// Kod dla Chrome, Safari oraz Opery
x.addEventListener("webkitAnimationStart", myStartFunction);
// Standardowa składnia
x.addEventListener("animationstart", myStartFunction);

Spróbuj sam

Składnia

object.addEventListener("webkitAnimationStart", myScript);  // Kod dla Chrome, Safari oraz Opery
object.addEventListener("animationstart", myScript);        // Standardowa składnia

Komentarz:Internet Explorer 8 i wcześniejsze wersje nie obsługują Metoda addEventListener().

Szczegóły techniczne

Bąbelkowanie: Obsługiwane
Można anulować: Nieobsługiwane
Typ zdarzenia: Zdarzenie AnimationEvent
Wersja DOM: Poziom 3 Zdarzenia

Obsługa przeglądarek

Liczby w tabeli wskazują na pierwszą wersję przeglądarki, która w pełni obsługuje to zdarzenie.

Liczby po "webkit" lub "moz" wskazują na pierwszą wersję prefixu używanego przed.

Zdarzenia Chrome IE Firefox Safari Opera
animationstart 4.0 webkit 10.0 16.0
5.0 moz		 4.0 webkit 15.0 webkit
12.1

Komentarz:Dla Chrome, Safari oraz Opery, użyj webkitAnimationEnd.

Powiązane strony

CSS Tutorial:Animacje CSS3

CSS Przeglądarka referencyjna:Atrybut animation CSS3

Przeglądarka dokumentów DOM HTML:Atrybut animation Style

Zdarzenia DOM Zdarzenie AnimationEvent