例項屬性
此介面繼承了其父介面 Animation 的屬性。
CSSTransition.transitionProperty只讀-
返回過渡的 CSS 屬性名稱(字串形式)。
例項方法
此介面繼承了其父介面 Animation 的方法。
沒有特定的方法。
示例
檢查返回的 CSSTransition
下面的示例中的過渡在懸停時改變了盒子的寬度。呼叫 Element.getAnimations() 返回一個包含所有 Animation 物件的陣列。在我們的例子中,這返回了一個 CSSTransition 物件,代表所建立的動畫。
css
.box {
background-color: #165baa;
color: white;
width: 100px;
height: 100px;
transition: width 4s;
}
.box:hover {
width: 200px;
}
js
const item = document.querySelector(".box");
item.addEventListener("transitionrun", () => {
let animations = document.querySelector(".box").getAnimations();
console.log(animations[0]);
});
規範
| 規範 |
|---|
| CSS Transitions Level 2 # the-CSSTransition-interface |
瀏覽器相容性
載入中…