Animasi CSS

Pada modul ini kita akan bahas transition-delay, yang berguna mengatur waktu delay sebuah transisi akan dilakukan. Dapat menggunakan satuan waktu s (seconds) atau ms (miliseconds). Menggunakan contoh dari modul CSS Transition – 1, kita tambahkan 1 button baru. Pada button tersebut kita tambahkan property transition-delay. Buka tab result , lalu coba hover pada button transition … Read more

Pada modul ini akan kita bahas transition-timing-function, yang mengatur behaviour dari kecepatan transisi. Ada lima nilai yang dapat digunakan: ease: efek dari transisi adalah dimulai lambat, kemudian cepat dan diakhir melambat. Ini adalah nilai default. linear – efek transisi adalah kecepatan sama dari awal hingga akhir. ease-in – efek transisi adalah animasi dimulai lambat. ease-out … Read more

Sebelum memulai membuat animasi, ada baiknya kita pahami beberapa rule penting yang digunakan dalam animasi CSS. CSS transitions memungkinkan kita untuk mengubah nilai suatu property pada suatu element dengan smooth pada durasi waktu yang diberikan. Rule yang akan kita bahas adalah transition-property dan transition-duration. Silakan lihat contoh berikut (click tab result). HTML akan berisi 2 … Read more