animate

动画元素放在形状元素的内部,用来定义一个元素的某个属性如何踩着时点改变。在指定持续时间里,属性从开始值变成结束值。

用法

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

属性

全局属性

专有属性

DOM接口

该元素实现了SVGAnimateElement 接口。

示例

SVG

<?xml version="1.0"?>
<svg width="120" height="120" viewPort="0 0 120 120" version="1.1"
     xmlns="http://www.w3.org/2000/svg">
  
  <rect x="10" y="10" width="100" height="100">
    <animate attributeType="XML" attributeName="x" from="-100" to="120"
        dur="10s" repeatCount="indefinite"/>
  </rect>
</svg>

结果

规范

Specification Status Comment
SVG Animations Level 2
<animate>
Editor's Draft No change
Scalable Vector Graphics (SVG) 1.1 (Second Edition)
<animate>
Recommendation Initial definition

 

浏览器兼容性

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 2.0 4.0 (2.0) 未实现 9.0 4.0
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support ? 4.0 (2.0) 未实现 9.5 4.0

该表格基于这些资源

文档标签和贡献者

标签: 
 此页面的贡献者: Ende93, luojia, Sebastianz, fanxiaojie, 329530588, lunix01
 最后编辑者: Ende93,