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:

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);

Cuba sendiri

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