レッスンに戻る

飛んでいる飛行機をアニメーションする (CSS)

重要性: 5

前のタスク 飛行機をアニメーションする (CSS) の解答を修正して、元のサイズ 400x240px よりも大きくなり(飛び出し)、その後元のサイズに戻るようにしてください。

次のように見えるようにします(飛行機をクリックしてください):

このアニメーションに対する正しいベジェ曲線を選ぶ必要があります。“飛び出す” ようにするため、どこかで y>1 となるタイミングが必要です。

例えば、cubic-bezier(0.25, 1.5, 0.75, 1.5) のように、両方の制御点が y>1 を取ることができます。

グラフは次の通りです:

サンドボックスで解答を開く