animateTransform

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since January 2020.

We'd love to hear more about your role and the company you work for
Please help us by answering a few questions.

animateTransform元素变动了目标元素上的一个变形属性,从而允许动画控制转换、缩放、旋转或斜切。

使用上下文

类别动画元素
允许的内容任意数量、任意顺序的下列元素:
描述性元素

示例

html
<?xml version="1.0"?>
<svg
  width="120"
  height="120"
  viewBox="0 0 120 120"
  xmlns="http://www.w3.org/2000/svg"
  version="1.1"
  xmlns:xlink="http://www.w3.org/1999/xlink">
  <polygon points="60,30 90,90 30,90">
    <animateTransform
      attributeName="transform"
      attributeType="XML"
      type="rotate"
      from="0 60 70"
      to="360 60 70"
      dur="10s"
      repeatCount="indefinite" />
  </polygon>
</svg>

属性

全局属性

专有属性

DOM 接口

该元素实现了 SVGAnimateTransformElement 接口。