変形CSSプロパティの詳細とデモ

transition-timing-functionプロパティ - [公式(英語)]

transition(変化)のタイミング・進行割合を指定

一般的にイージング機能と呼ばれる機能の指定をします。

ブラウザのサポート状況

Internet Explorer 6 Internet Explorer 7 Internet Explorer 8 Internet Explorer 9 Firefox Google Chorme Safari Opera
× × × × ×

プロパティ

ease開始と終了を滑らかに(初期値) = cubic-bezier(0.25, 0.1, 0.25, 1.0)
linear一定 = cubic-bezier(0.0, 0.0, 1.0, 1.0)
ease-inゆっくり開始 = cubic-bezier(0.42, 0, 1.0, 1.0)
ease-outゆっくり終了 = cubic-bezier(0, 0, 0.58, 1.0)
ease-in-outゆっくり開始、ゆっくり終了 = cubic-bezier(0.42, 0, 0.58, 1.0)
アニメーションの動作方法3次ベジェ曲線のP1とP2を (x1, y1, x2, y2) で指定