Peristiwa transitionend

Event DOM Event TransitionEvent

Definisi dan Penggunaan

Peristiwa transitionend terjadi saat transisi CSS selesai.

Keterangan:Jika transisi dihapus sebelum selesai, misalnya jika CSS dihapus transition-property Properti, transisiend peristiwa tidak akan diaktifkan.

Untuk mendapatkan pengetahuan lebih lanjut tentang transition CSS, belajar di Tutorial Transition CSS3.

Contoh

Lakukan sesuatu terhadap elemen <div> saat transisi CSS selesai:

// Kode untuk Safari 3.1 sampai 6.0
document.getElementById("myDIV").addEventListener("webkitTransitionEnd", myFunction);
// Syntax Standar
document.getElementById("myDIV").addEventListener("transitionend", myFunction);

Coba Sendiri

Syntax

object.addEventListener("webkitTransitionEnd", myScript);  // Kode untuk Safari 3.1 sampai 6.0
object.addEventListener("transitionend", myScript);        // Syntax Standar

Keterangan:Internet Explorer 8 atau versi yang lebih awal tidak mendukung Metode addEventListener().

Detil Teknologi

Bubbling: Dukung
Dapat Dibatalkan: Dukung
Tipe Peristiwa: Event TransitionEvent
Versi DOM: Level 3 Events

Dukungan Browser

Angka di tabel menunjukkan versi pertama browser yang mendukung peristiwa ini penuh.

Angka yang dijadikan referensi di tabel menunjukkan versi pertama browser yang mendukung peristiwa ini.

Peristiwa Chrome IE Firefox Safari Opera
transitionend 26.0
4.0 (webkit)		 10.0 16.0
4.0 (moz)		 6.1
3.1 (webkit)		 12.1
10.5 (o)

Laman yang berhubungan

Tutorial CSS: Transition CSS3

Panduan Referensi CSS: Properti Transition CSS3

Referensi CSS: Properti transition-property CSS3

Event DOM Event TransitionEvent