Zdarzenie animationend

Definicja i użycie

Kiedy animacja CSS się skończy, występuje zdarzenie animationend.

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

Kiedy animacja CSS jest odtwarzana, mogą wystąpić trzy zdarzenia:

Przykład

Kiedy animacja CSS się skończy, zrób coś z elementem <div>:

var x = document.getElementById("myDIV");
// kod dla Chrome, Safari oraz Opery
x.addEventListener("webkitAnimationEnd", myEndFunction);
// standardowa składnia
x.addEventListener("animationend", myEndFunction);

Spróbuj sam

Składnia

obiekt.addEventListener("webkitAnimationEnd", myScript);  // kod dla Chrome, Safari oraz Opery
obiekt.addEventListener("animationend", 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ę, używaną jako prefiks.

zdarzenie Chrome IE Firefox Safari Opera
animationend 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 podręcznik:Animacje CSS3

Przeglądarka CSS referencyjna:Atrybut animation CSS3

Przeglądarka HTML DOM referencyjna:Atrybut animation stylu