Style transition 屬性
Style 對象實例
把滑鼠指針懸停在 div 元素上，它的外觀會逐漸改變：
document.getElementById("myDIV").style.transition="all 2s";
定義和用法
transition 屬性是一個速記屬性，用於設置四個過渡屬性：
transitionProperty、 transitionDuration、 transitionTimingFunction 和 transitionDelay.
注意：請始終設置 transitionDuration 屬性，否則持續時間為 0，就不會產生過渡效果。
流覽器支持
Internet Explorer 10、Firefox、Opera 和 Chrome 支持 transition 屬性。
Safari 支持另一個可替代該屬性的屬性，即 WebkitTransition 屬性。
注意：Internet Explorer 9 及其之前的版本不支持 transition 屬性。
語法
返回 transition 屬性：
object.style.transition
設置 transition 屬性：
object.style.transition="property duration timing-function delay|initial|inherit"
屬性值
| 值 | 描述 |
|---|---|
| transitionProperty | 規定應用過渡效果的 CSS 屬性的名稱。 |
| transitionDuration | 規定完成過渡效果需要多少秒或毫秒。 |
| transitionTimingFunction | 規定過渡效果的速度曲線。 |
| transitionDelay | 定義過渡效果何時開始。 |
| initial | 設置該屬性為它的默認值。請參閱 initial。 |
| inherit | 從父元素繼承該屬性。請參閱 inherit。 |
技術細節
| 默認值： | all 0 ease 0 |
|---|---|
| 返回值： | 字串，表示元素的 transition 屬性。 |
| CSS 版本 | CSS3 |
相關文章
CSS 參考手冊：transition 屬性