animationstart event

DOM events AnimationEvent

Definitie en gebruik

De animationstart-gebeurtenis treedt op wanneer de CSS-animatie begint te spelen.

Voor meer informatie over CSS-animaties, raadpleeg onze CSS3 Animatie Handleiding.

Er kunnen drie gebeurtenissen optreden wanneer de CSS-animatie speelt:

Voorbeeld

Doe iets met het <div>-element wanneer de CSS-animatie begint:

var x = document.getElementById("myDIV");
// Code voor Chrome, Safari en Opera
x.addEventListener("webkitAnimationStart", myStartFunction);
// Standaard syntaxis
x.addEventListener("animationstart", myStartFunction);

Probeer het zelf

Syntaxis

object.addEventListener("webkitAnimationStart", myScript);  // Code voor Chrome, Safari en Opera
object.addEventListener("animationstart", myScript);        // Standaard syntaxis

Opmerking:Internet Explorer 8 of eerder ondersteunt dit niet addEventListener() methode.

Technische details

Bubbelend: Ondersteund
Annuleerbaar: Niet ondersteund
Gebeurtenistype: AnimationEvent
DOM versie: Niveau 3 Gebeurtenissen

Browserondersteuning

De cijfers in de tabel vermelden de eerste browserversie die het gebeurtenis volledig ondersteunt.

De cijfers achter 'webkit' of 'moz' vermelden de eerste versie met het voorvoegsel die wordt gebruikt.

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

Opmerking:Voor Chrome, Safari en Opera, gebruik webkitAnimationEnd.

Gerelateerde pagina's

CSS Handleiding:CSS3 animation

CSS Referentie Handboek:CSS3 animation attribute

HTML DOM reference manual:Style animation attribute

DOM events AnimationEvent