Latest web development tutorials

animationiteration Veranstaltung

Ereignisobjektreferenz Ereignisobjekte

Beispiele

Wenn CSS-Animation Replay-Element hinzugefügt wird, wie ein <div> hört für Veranstaltungen:

var x = document.getElementById ( "myDiv");

// Chrome, Safari und Opera Codes
x.addEventListener ( "webkitAnimationIteration", myStartFunction);

// Standard-Syntax
x.addEventListener ( "animationiteration", myStartFunction);

Versuchen »


Definition und Verwendung

animationiteration Ereignis ausgelöst wird, wenn die CSS-Animation Wiedergabe.

Wenn die CSS - Animation-Iteration-COUNT - Attribut ist auf "1" ist , wird die Animation nur einmal spielen, wird animationiteration Ereignis nicht mehr ausgelöst.

Mehr über CSS - Animation finden Sie in unserer CSS3 Animation Abschnitt.

CSS-Animation spielt, werden die folgenden drei Ereignisse auftreten:

  • animationstart - nach dem Start der CSS - Animation - Trigger
  • animationiteration - CSS-Animationen ausgelöst wiederholen
  • die animationEnd - nach Abschluss Auslöser der CSS

Browser-Unterstützung

Die Zahlen in der Tabelle stellen die erste Browser, um diese Version der Ereignisse zu unterstützen.

"Webkit" oder "moz" nach einer bestimmten Anzahl Vorwahlnummer als die erste Version, die Veranstaltung zu unterstützen.

Ereignis
animationiteration 4.0 webkit 10.0 16.0
5,0 moz
4.0 webkit 15,0 webkit
12.1

Hinweis: Chrome, Safari und Opera - Browser webkitAnimationEnd Präfix.


Grammatik

object.addEventListener ( "webkitAnimationIteration", myScript) ; // Chrome, Safari und Opera Codes
Objekt .addEventListener ( "animationiteration", myScript ); // Standard - Syntax

Hinweis: Internet Explorer 8 und frühere Versionen von IE nicht unterstützen addEventListener () Methode.


Technische Details
Ob die Blase zu unterstützen: ja
Es kann abgebrochen werden: keine
Ereignistyp: AnimationEvent


Verwandte Seiten

CSS Tutorial: CSS3 Animationen

CSS Referenz: CSS3 Animationseigenschaften

CSS Referenz: CSS3 - Animation-Iteration-Count - Eigenschaft

HTML - DOM Referenz: Style - Animationseigenschaften


Ereignisobjektreferenz Ereignisobjekte