備忘録的プログラミングリファレンス

animationiterationイベント

　animationiterationイベントは、CSSアニメーションの実行の繰り返えしを捉えるイベントタイプです。 AnimationEventのイベントタイプです。

　CSSアニメーションの繰り返しは、CSSのanimation-iteration-countプロパティによって設定します。 このプロパティが1の時には繰り返しの実行は起きません。繰り返しで実行するためにはanimation-iteration-countプロパティが2以上である必要があります。
　繰り返し設定、animation-iteration-count: 2;以上の時に、animationiterationイベントは発生します。

　CSSアニメーションの実行には、以下のイベントタイプがあります。

animationstartCSSアニメーションが始まったら
animationiterationCSSアニメーションが繰り返したら
animationendCSSアニメーションが完了したら

Syntax

　Chrome 4.0, Safari 4.0, Opera 15.0以降は"webkitAnimationEnd"で指定する必要があります。

in JavaScript

for Chrome, Safari, Opera

object.addEventListener("webkitAnimationIteration", script_);

上記以外

object.addEventListener("animationiteration", script_);

備考（Remarks）

Bubblesyes
Cancelableno
InterfaceAnimationEvent

Example

確認ボタンをクリックしてください。以下のHTML,CSS,Scriptコード例が実行されます。