geçiş etkinliği
Örnek
Bir CSS geçişi sona erdiğinde <div> öğesiyle bir şeyler yapın:
// Code for Safari 3.1 to 6.0
document.getElementById("myDIV").addEventListener("webkitTransitionEnd", myFunction);
// Standard syntax
document.getElementById("myDIV").addEventListener("transitionend", myFunction);
Tanım ve Kullanım
Geçiş sonu olayı, bir CSS geçişi tamamlandığında gerçekleşir.
Not: Geçiş tamamlanmadan önce kaldırılırsa, örneğin CSS geçiş özelliği özelliği kaldırılırsa, geçiş olayı tetiklenmez.
CSS Geçişleri hakkında daha fazla bilgi için CSS3 Geçişleri hakkındaki eğiticimize bakın .
Tarayıcı Desteği
Tablodaki sayılar, olayı tam olarak destekleyen ilk tarayıcı sürümünü belirtir.
"Webkit", "moz" veya "o" ile takip edilen sayılar, bir önekle çalışan ilk sürümü belirtir.
Event | |||||
---|---|---|---|---|---|
transitionend | 26.0 4.0 (webkitTransitionEnd) |
10.0 | 16.0 4.0 (mozTransitionEnd) |
6.1 3.1 (webkitTransitionEnd) |
12.1 10.5 (oTransitionEnd) |
Sözdizimi
object.addEventListener("webkitTransitionEnd", myScript); // Code for Safari 3.1 to 6.0
object.addEventListener("transitionend", myScript); // Standard syntax
Not: addEventListener () yöntemi, Internet Explorer 8 ve önceki sürümlerde desteklenmez.
Teknik detaylar
kabarcıklar: | Evet |
---|---|
İptal edilebilir: | Evet |
Etkinlik tipi: | GeçişEtkinliği |
DOM Sürümü: | 3. Seviye Etkinlikleri |
İlgili Sayfalar
CSS Eğitimi: CSS3 Geçişleri
CSS Referansı: CSS3 geçiş Özelliği
CSS Referansı: CSS3 geçiş özelliği Özellik