animationstart händelse

DOM händelser AnimationEvent

Definition och användning

När CSS-animationen börjar spelas upp inträffar animationstart-händelsen.

För mer information om CSS-animation, lär dig vår CSS3-animation kurs.

När CSS-animationen spelas upp kan tre händelser inträffa:

Exempel

När CSS-animationen börjar, gör något med <div>-elementet:

var x = document.getElementById("myDIV");
// Kod för Chrome, Safari och Opera
x.addEventListener("webkitAnimationStart", myStartFunction);
// Standard syntax
x.addEventListener("animationstart", myStartFunction);

Prova själv

Syntax

object.addEventListener("webkitAnimationStart", myScript);  // Kod för Chrome, Safari och Opera
object.addEventListener("animationstart", myScript);        // Standard syntax

Kommentar:Internet Explorer 8 och tidigare versioner stöder inte addEventListener() metod.

Tekniska detaljer

Bubbling: Stödd
Avbrytbar: Inte stödd
HändelseTyp: AnimationEvent
DOM-version: Nivå 3 Händelser

Webbläsarstöd

Numren i tabellen anger den första webbläsarversionen som fullständigt stöder händelsen.

Numret efter "webkit" eller "moz" anger den första versionen som använde prefixet.

Händelser Chrome IE Firefox Safari Opera
animationstart 4.0 webkit 10.0 16.0
5.0 moz		 4.0 webkit 15.0 webkit
12.1

Kommentar:För Chrome, Safari och Opera, använd webkitAnimationEnd.

Relaterade sidor

CSS kurs:CSS3 animation

CSS referenshandbok:CSS3 animation egenskap

HTML DOM referenshandbok:Style animation egenskap

DOM händelser AnimationEvent