animationiteration Acara

Contoh

Lakukan sesuatu dengan <div> elemen ketika animasi CSS diulang:

var x = document.getElementById("myDIV");

// Code for Chrome, Safari and Opera
x.addEventListener("webkitAnimationIteration", myRepeatFunction);

// Standard syntax
x.addEventListener("animationiteration", myRepeatFunction);

Cobalah sendiri "

Definisi dan Penggunaan

Acara animationiteration terjadi ketika animasi CSS diulang.

Jika CSS animationiteration-count properti diatur ke "1" , yang berarti bahwa animasi hanya akan bermain satu kali, acara animationiteration tidak terjadi. animasi perlu dijalankan lebih dari sekali untuk acara ini untuk api.

Untuk informasi lebih lanjut tentang CSS Animasi, lihat tutorial kami pada CSS3 Animasi .

Ketika animasi CSS memainkan, ada tiga peristiwa yang dapat terjadi:

animationstart - terjadi ketika CSS animasi telah dimulai
animationiteration - terjadi ketika CSS animasi diulang
animationend - terjadi ketika animasi CSS telah menyelesaikan

Dukungan Browser

Angka-angka dalam tabel menentukan versi browser pertama yang mendukung penuh acara tersebut.

Nomor diikuti oleh "webkit" atau "moz" tentukan versi pertama yang bekerja dengan awalan.

Peristiwa
animationiteration	4.0 webkit	10,0	16.0 5.0 moz	4.0 webkit	15,0 webkit 12.1

Catatan: Untuk Chrome, Safari dan Opera, menggunakan awalan webkitAnimationIteration.

Sintaksis

object.addEventListener("webkitAnimationIteration", myScript ); // Code for Chrome, Safari and Opera
object .addEventListener("animationiteration", myScript ); // Standard syntax

Catatan: addEventListener() metode tidak didukung di Internet Explorer 8 dan versi sebelumnya.