例
animationTimingFunctionプロパティ変更<div>要素を:
document.getElementById("myDIV").style.animationTimingFunction = "linear";
»それを自分で試してみてください 定義と使用法
animationTimingFunctionは、アニメーションの速度曲線を指定します。
速度曲線は、アニメーションが別のCSSスタイルの1セットから変更するために使用する時間を定義します。
速度曲線を滑らかに変更を加えるために使用されています。
ブラウザのサポート
表中の数字は完全にプロパティをサポートする最初のブラウザのバージョンを指定します。
MOZに続く数字は、接頭辞で働いていた最初のバージョンを指定します。
プロパティ | |||||
---|---|---|---|---|---|
animationTimingFunction | 43.0 | サポートされていません | 16.0 5.0 MOZ | サポートされていません | 30.0 |
構文
animationTimingFunctionプロパティを返します:
object .style.animationTimingFunction
animationTimingFunctionプロパティを設定します。
object .style.animationTimingFunction="linear|ease|ease-in|ease-out|cubic-bezier( プロパティ値 値 説明 linear アニメーションは最初から最後まで同じ速度を持っています ease デフォルト値。 それはゆっくり終わる前にアニメーションは、その後、速い、遅いスタートを持っています ease-in アニメーションは、スロースタートを持っています ease-out アニメーションは遅い端部を有し、 ease-in-out アニメーションは、スロースタート、スローエンドの両方を持っています cubic- bezier( n , n , n , n ) 立方ベジエ機能に独自の値を定義します。
可能な値は0から1までの数値です initial このプロパティがデフォルト値に設定します。 最初の記事を読みます inherit その親要素からこのプロパティを継承します。 継承についての記事を読みます
技術的な詳細
デフォルト値: 楽 戻り値: 要素のアニメーションタイミング機能性を表す文字列、 CSSのバージョン CSS3
関連ページ
CSSリファレンス: animation-timing-function property
<スタイルオブジェクト