Visitar URL original
Animasikan bidang yang terbang (CSS)
kembali ke pelajaran

Animasikan bidang yang terbang (CSS)

Modifikasi solusi dari tugas sebelumnya Animasi sebuah bidang (CSS) untuk membuat bidang yang tumbuh dari ukuran aslinya 400x240px (melompat keluar) , dan kembalikan ukuran tersebut.

Ini adalah contoh bagaimana bidangnya terlihat (klik pada bidangnya):

Gunakan solusi dari tugas sebelumnya sebagai acuan.

Kita harus memilih Bezier Curve yang cocok untuk animasinya. Yang mana harus memiliki y>1 agar bidangnya dapat “melompat keluar”.

Contoh, kita bisa menggunakan titik kontrol dengan y>1, seperti cubic-bezier(0.25, 1.5, 0.75, 1.5).

Grafiknya:

Buka solusi di kotak pasir.