CSSTransition：transitionProperty 属性

transitionProperty 是 CSSTransition 接口的属性，它返回过渡的扩展过渡属性名称。这是生成过渡的完整 CSS 属性。

值

字符串。

示例

返回 transitionProperty

以下示例中的过渡在悬停时更改框的宽度。调用 Element.getAnimations() 返回所有 Animation 对象的数组。在我们的例子中，这返回一个 CSSTransition 对象，表示创建的动画。transitionProperty 属性返回创建过渡的属性，即 width。

css
.box {
  background-color: #165baa;
  color: #fff;
  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].propertyName);
});

规范

规范
CSS Transitions Level 2
# dom-csstransition-transitionproperty

浏览器兼容性

BCD 表格仅在浏览器中加载