Вернуться к уроку

Анимировать самолёт с перелётом (CSS)

важность: 5

Модифицируйте решение предыдущей задачи Анимировать самолёт (CSS), чтобы в процессе анимации изображение выросло больше своего стандартного размера 400x240px («выпрыгнуло»), а затем вернулось к нему.

Должно получиться как здесь (клик на картинку)

В качестве исходного документа возьмите решение предыдущей задачи.

Для такой анимации необходимо подобрать правильную кривую Безье.

Чтобы она выпрыгивала вверх, обе опорные точки можно вынести по y>1, например: cubic-bezier(0.25, 1.5, 0.75, 1.5) (промежуточные опорные точки имеют y=1.5).

Её график:

Открыть решение в песочнице.