CSS3 Pre-Reference



animation-duration

アニメーション時間

試す

コード

#containe {
  animation-name: 'wobble';
  animation-duration: 5s;
  animation-iteration-count: infinite;

  -webkit-animation-name: 'wobble';
  -webkit-animation-duration: 5s;
  -webkit-animation-iteration-count: infinite;
}

サンプル

その後(けむり)したから火がある。吾輩がない、腹がこんな片輪(があとで運転して勤まるものであるか自分だけがいわゆる人間中からとにかく明るくてい上(かたわ)った。

コメントする


対応ブラウザ

Firefox
まだ
Chrome/Safari
4.0~
Opera
まだ
InternetExplorer
まだ

パラメータ

<時間> [ ‘,’ <時間> ]*
初期値 0
適用 ブロックレベル要素とインラインレベル要素
継承 しない
レベル 3
%の解釈 -
適用メディア Visual
参考文献 CSS Animations Module Level 3#3.3 The ‘animation-duration’ Property

解説

アニメーション時間を指定します。

値は時間をカンマ区切りで指定します。値を複数指定した場合は、それぞれ”animation-timing-function”と連携します。

初期状態ではゼロですので、アニメーションしません。

トラックバック

投稿されたコメント