Generator Animasi CSS untuk orang malas.
Animasi CSS
CSS memungkinkan animasi elemen HTML tanpa menggunakan JavaScript atau Flash
Dalam bab ini Anda akan mempelajari tentang sifat-sifat berikut:
- @keyframes
- nama-animasi
- animasi-durasi
- animasi-tunda
- animasi-iterasi-hitung
- animasi-arah
- animasi-waktu-fungsi
- animasi-isi-mode
- animasi
Awalan Khusus Peramban
Beberapa browser lama memerlukan awalan khusus (-webkit-) untuk memahami properti animasi
Apa itu Animasi CSS?
Animasi memungkinkan elemen secara bertahap berubah dari satu gaya ke gaya lainnya.
Anda dapat mengubah properti CSS sebanyak yang Anda inginkan, sebanyak yang Anda inginkan.
Untuk menggunakan animasi CSS, Anda harus terlebih dahulu menentukan beberapa keyframe untuk animasi tersebut.
Keyframes menyimpan gaya apa yang akan dimiliki elemen pada waktu tertentu.
Aturan @keyframes
Saat Anda menentukan gaya CSS di dalam aturan @keyframes, animasi akan berubah secara bertahap dari gaya saat ini ke gaya baru pada waktu tertentu.