CSS3 アニメーションフィルモード プロパティ_html/css_WEB-ITnose

私は今、モバイル開発プロジェクトに重点を置いています。新しい知識ポイントに出会ったら、それをみんなと共有します

animation-fill-mode: オブジェクトをある場所から別の場所に移動し、そこにそのままにしておきます

定義と使用法

animation-fill-mode プロパティは、アニメーションが再生されないとき (アニメーションが完了するとき、またはアニメーションに遅延があり再生が開始されないとき)、適用されるスタイルを指定します。要素に。

デフォルトでは、CSS アニメーションは最初のキーフレームが再生されるまで要素に影響を与えず、最後のキーフレームが完了すると要素への影響を停止します。 anime-fill-mode プロパティはこの動作をオーバーライドします。

デフォルト: 継承: アニメーション可能: バージョン: JavaScript 構文:

なし

いいえ

いいえ。

CSS3

object.style.animationFillMode="forwards"

特に JS コントロールの場合、最後のキーフレームが完了した後に影響を与えないように復元することもできます。うわぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁぁ