Latihan 2 dari materi CSS Transitions di CSS — praktek dengan editor kode interaktif, test case otomatis, dan hint terpandu. Langsung jalan di browser.
Kotak Hover! sudah membesar waktu di-hover (.kotak:hover punya transform: scale(1.2)), tapi membesarnya loncat. Bikin halus.
Di rule .kotak (bukan .kotak:hover), tambahkan:
transition: transform 0.5s ease-in-out
Ditaruh di .kotak biar membesar dan mengecilnya sama-sama halus.
Hint
Yang berubah waktu hover adalah transform, jadi itu juga yang harus dianimasikan.
Pakai transition di rule .kotak (keadaan normal), dengan tiga bagian berurutan: transform, 0.5s, ease-in-out.
