Style transition Özelliği

Tanım ve Kullanım

transition Bu özellik dört geçiş özelliğinin kısaltma özelliğidir:

Yorum:Her zaman belirleyin transitionDuration Özelliğiaksi takdirde süresi 0 olacaktır ve geçiş geçersiz olacaktır.

Ayrıca bakınız：

CSS Referans Kılavuzu：transition Özelliği

Örnek

div elementinin üzerine fareyi getirerek görünümünü yavaşça değiştirin:

document.getElementById("myDIV").style.transition = "all 2s";

Deneyin

Gramer

transition Özelliğini döndür:

nesne.style.transition

transition Özelliğini ayarla:

nesne.style.transition = "özellik süreme zamanlama fonksiyonu gecikme|initial|inherit"

Özellik Değeri

Değer Açıklama
transitionProperty Geçiş etkisinin hangi CSS özelliklerine yönelik olduğunu belirtir.
transitionDuration Geçiş etkisinin ne kadar süreceğini veya milisaniyeyi tamamlaması gerektiğini belirtir.
transitionTimingFunction Geçiş etkisinin hız eğrisini belirler.
transitionDelay Geçiş etkisinin ne zaman başlayacağını tanımlar.
initial Bu özelliği öntanımlı değerine ayarlar. Ayrıca bakınız initial。
inherit Bu özelliği ebeveyn elementinden devralır. Ayrıca bakınız inherit。

Teknik Detaylar

Öntanımlı Değer: all 0 ease 0
Dönüşüm değeri: Dizgi,元素的 transition Özelliği。
CSS Sürümü： CSS3

Tarayıcı Desteği

Tablodaki rakamlar, bu özelliği tam olarak destekleyen ilk tarayıcı sürümünü belirtmektedir.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
26.0 10.0 16.0 6.1 12.1