レッスンに戻る

フライングプレーンのアニメート(CSS)

重要度:5

飛行機が本来のサイズ(400 x 240 ピクセル)より大きく拡大(飛び出す)し、その後元のサイズに戻るように、平面をアニメーション化する(CSS)という前課題の解決策を変更します。

こちらをクリックすると、どのように表示されるかを確認できます(飛行機をクリックしてください)。

前課題の解決策をソースとして使用します。

このアニメーションに合ったベジェ曲線を選択する必要があります。飛行機が「飛び出す」ためには、どこかでy>1である必要があります。

たとえば、y>1を持つ 2 つの制御ポイントを使用できます(例:cubic-bezier(0.25, 1.5, 0.75, 1.5))。

グラフ

サンドボックスでソリューションを開きます。