Contoh
Mengubah animasi dari <div> elemen, menggunakan properti singkat:
// Code for Chrome, Safari and Opera
document.getElementById("myDIV").style.WebkitAnimation = "mynewmove 4s 2";
// Standard syntax
document.getElementById("myDIV").style.animation =
"mynewmove 4s 2"; Cobalah sendiri " Definisi dan Penggunaan
Properti animasi adalah properti singkatan untuk enam sifat animasi:
animationName
animationDuration
animationTimingFunction
animationDelay
animationIterationCount
animationDirection
Note: Selalu menentukan properti animationDuration, jika durasi adalah 0, dan tidak akan pernah dimainkan.
Dukungan Browser
Angka-angka dalam tabel menentukan versi browser pertama yang sepenuhnya mendukung properti.
Nomor diikuti oleh WebKit, Moz, atau O tentukan versi pertama yang bekerja dengan awalan.
| Milik | |||||
|---|---|---|---|---|---|
| animation | 43.0 4.0 Webkit | 10,0 | 16.0 5.0 Moz | 4.0 Webkit | 30.0 15,0 Webkit 12.1 12,0 -o- |
Catatan: Chrome, Safari dan Opera mendukung alternatif, properti WebkitAnimation.
Sintaksis
Kembali properti animasi:
object .style.animation Mengatur properti animasi:
object .style.animation=" Nilai properti Nilai Deskripsi animationName Menentukan nama keyframe yang Anda ingin mengikat pemilih animationDuration Menentukan berapa detik atau milidetik animasi diperlukan untuk menyelesaikan
animationTimingFunction Menentukan kurva kecepatan animasi animationDelay Menentukan penundaan sebelum animasi akan mulai
animationIterationCount Menentukan berapa kali animasi harus dimainkan animationDirection Menentukan apakah atau tidak animasi harus bermain secara terbalik pada siklus alternatif animationFillMode Menentukan nilai-nilai apa yang diterapkan oleh animasi luar waktu yang mengeksekusi animationPlayState Menentukan apakah animasi sedang berjalan atau berhenti initial Set properti ini ke nilai default. Baca tentang awal inherit Mewarisi properti ini dari elemen induknya. Baca tentang mewarisi
Rincian teknis
Nilai default: none 0 kemudahan 0 1 yang normal tidak berjalan Kembali Nilai: Sebuah String, yang mewakili properti animasi dari elemen CSS Versi CSS3
Pages terkait
Referensi CSS: animation property
<Style Object