非常教程

SVG参考手册

分类 | Elements

animatetransform

animateTransform允许目标元件上的变换属性,由此允许动画控制平移,缩放,旋转和/或倾斜。

用法上下文

分类

动画元素

允许的内容

任意数量的以下元素,以任何顺序:描述性元素

<?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>

示例

属性

全局属性

  • Conditional processing attributes »
  • Core attributes »
  • Animation event attributes »
  • Xlink attributes »
  • Animation attribute target attributes »
  • Animation timing attributes »
  • Animation value attributes »
  • Animation addition attributes »
  • externalResourcesRequired

具体属性

  • by
  • from
  • to
  • type

DOM接口

这个元素实现了SVGAnimateTransformElement接口。

产品规格

Specification

Status

Comment

SVG Animations Level 2The definition of '<animateTransform>' in that specification.

Editor's Draft

No change

Scalable Vector Graphics (SVG) 1.1 (Second Edition)The definition of '<animateTransform>' in that specification.

Recommendation

Initial definition

浏览器兼容性

Feature

Chrome

Firefox (Gecko)

IE

Opera

Safari

Basic support

(Yes)

(Yes)

No support

(Yes)

?

Feature

Android

Firefox Mobile (Gecko)

IE Phone

Opera Mobile

Safari Mobile

Basic support

?

?

?

?

?

SVG

可缩放矢量图形是基于可扩展标记语言(标准通用标记语言的子集),用于描述二维矢量图形的一种图形格式。它由万维网联盟制定,是一个开放标准。