Properti transisi HTML DOM Style
contoh
Pointer mouse melayang di atas elemen div, secara bertahap akan mengubah penampilan:
document.getElementById("myDIV").style.transition="all 2s";
Coba »
Definisi dan Penggunaan
Properti transisi adalah properti singkatan untuk menetapkan empat sifat transisi:
transitionProperty, transitionDuration, transitionTimingFunction dan transitionDelay.
Catatan: properti transitionDuration Selalu mengatur, jika durasi adalah nol, tidak akan menghasilkan efek transisi.
Dukungan Browser
Internet Explorer 10, Firefox, Opera dan Chrome mendukung properti transisi.
Safari mendukung alternatif lain dari properti atribut bahwa properti WebkitTransition.
Catatan: Internet Explorer 9 dan versi sebelumnya tidak mendukung properti transisi.
tatabahasa
Pengembalian transisi atribut:
object .style.transition
Mengatur properti transisi:
object .style.transition="property duration timing-function delay|initial|inherit"
Nilai properti
| 值 | 描述 |
|---|---|
| transitionProperty | 规定应用过渡效果的 CSS 属性的名称。 |
| transitionDuration | 规定完成过渡效果需要多少秒或毫秒。 |
| transitionTimingFunction | 规定过渡效果的速度曲线。 |
| transitionDelay | 定义过渡效果何时开始。 |
| initial | 设置该属性为它的默认值。请参阅 initial 。 |
| inherit | 从父元素继承该属性。请参阅 inherit 。 |
rincian teknis
| default: | semua 0 kemudahan 0 |
|---|---|
| Pengembalian: | String yang mewakili atribut unsur transisi. |
| versi CSS | CSS3 |
Artikel terkait
CSS Referensi: Properti Transisi