animateMotion
<animateMotion>
元素定义了一个元素如何沿着运动路径进行移动。
示例
html,body,svg { height:100%; margin: 0; padding: 0; display:block; }
<svg viewBox="0 0 200 100" xmlns="http://www.w3.org/2000/svg">
<path fill="none" stroke="lightgrey"
d="M20,50 C20,-50 180,150 180,50 C180-50 20,150 20,50 z" />
<circle r="5" fill="red">
<animateMotion dur="10s" repeatCount="indefinite"
path="M20,50 C20,-50 180,150 180,50 C180-50 20,150 20,50 z" />
</circle>
</svg>
用法
属性
Global 属性
专有属性
DOM 接口
该元素实现了 SVGAnimateMotionElement
接口。
规范
Specification |
---|
SVG Animations Level 2 # AnimateMotionElement |
浏览器兼容性
BCD tables only load in the browser