Peristiwa animationstart
Definisi dan penggunaan
Peristiwa animationstart berlaku apabila animasi CSS mula dimainkan.
Untuk pengalaman lanjut tentang animasi CSS, belajar kursus kami Panduan Animasi CSS3.
Tiga peristiwa boleh berlaku apabila animasi CSS dimainkan:
- animationstart - Dialu-alu apabila animasi CSS mula
- animationiteration - Dialu-alu apabila animasi CSS diulangi
- animationend - Dialu-alu apabila animasi CSS selesai
Contoh
Lakukan sesuatu kepada elemen <div> apabila animasi CSS mula:
var x = document.getElementById("myDIV"); // Kod untuk Chrome, Safari serta Opera x.addEventListener("webkitAnimationStart", myStartFunction); // Gramaian standar x.addEventListener("animationstart", myStartFunction);
Gramaian
object.addEventListener("webkitAnimationStart", myScript); // Kod untuk Chrome, Safari serta Opera object.addEventListener("animationstart", myScript); // Gramaian standar
Komentar:Internet Explorer 8 atau versi yang lebih awal tidak mendukung Metode addEventListener().
Perincian teknikal
Bubbling: | Disokong |
---|---|
Boleh dibatalkan: | Tidak disokong |
Jenis peristiwa: | AnimationEvent |
Versi DOM: | Peristiwa Level 3 |
Dukungan pereka pereka
Nombor di dalam tabel menunjukkan versi pereka pereka yang mendukung peristiwa ini sepenuhnya.
Nombor di belakang "webkit" atau "moz" menunjukkan versi pertama yang digunakan sebelum penamaan awalan.
Peristiwa | Chrome | IE | Firefox | Safari | Opera |
---|---|---|---|---|---|
animationstart | 4.0 webkit | 10.0 | 16.0 5.0 moz |
4.0 webkit | 15.0 webkit 12.1 |
Komentar:Untuk Chrome, Safari serta Opera, gunakan webkitAnimationEnd.
Halaman yang berkaitan
Panduan CSS:Animasi CSS3
CSS Rujukan:Sifat animation CSS3
HTML DOM Reference Manual:Sifat animation Style