Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

animation-iteration-count

これは実験段階の機能です。
この機能は複数のブラウザで開発中の状態にあります。各ブラウザで用いるために、適切なベンダー接頭辞が必要な場合があります。互換性テーブルをチェックしてください。また、実験段階の機能の構文と挙動は、仕様変更に伴い各ブラウザの将来のバージョンで変更になる可能性があることに注意してください。

概要

animation-iteration-count CSS プロパティは、アニメーションを停止するまでに、アニメーションの周期を何回実行するかを定義します。

アニメーション関連のプロパティをまとめて設定できる短縮プロパティである animation プロパティを使用すると便利でしょう。

初期値1
適用対象全要素、::before / ::after 疑似要素
継承不可
メディアvisual
計算値指定値
アニメーションの可否不可
正規順序形式文法で定義される一意のあいまいでない順序

構文

書式: [ infinite | <number> ] [, [ infinite | <number> ] ]*
animation-iteration-count: infinite

animation-iteration-count: 3
animation-iteration-count: 2.5

animation-iteration-count: 2, 0, infinite

infinite
アニメーションは無期限に繰り返されます。
<number>
アニメーションを繰り返す回数。初期値は 1 です。負の値は 0 として扱われます。また、アニメーションの周期の一部を実行するために、整数以外の値を指定することも可能です。例えば 0.5 を指定すると、アニメーションの周期の半分を実行します。

例示

CSS アニメーション』の頁を参照してください。

仕様

仕様書 策定状況 コメント
CSS Animations Level 3 草案  

ブラウザ実装状況

機能 Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
基本サポート (有) -webkit 5.0 (5.0) -moz
16.0 (16.0)
10 12 -o
12.5 #
4.0 -webkit
機能 Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
基本サポート (有) -webkit 5.0 (5.0) -moz
16.0 (16.0)
? ? ?

関連情報

ドキュメントのタグと貢献者

 このページの貢献者: teoli, ethertank, yyss, FredB
 最終更新者: teoli,