svg图像动画浏览器兼容性

时间:2014-06-11 12:13:33

标签: animation svg cross-browser webkit

我通过修改源代码中的代码来动画svg图像。 它在火炬浏览器中运行完美,但在谷歌浏览器和其他浏览器中没有动画。 我在svg image的xml文件中使用此代码进行动画。

<animateColor attributeName="fill" attributeType="XML" from="black" to="grey" dur=".5s" repeatCount="indefinite"/>   
<animateColor attributeName="stroke" attributeType="XML" from="black" to="grey" dur=".5s" repeatCount="indefinite"/> 

2 个答案:

答案 0 :(得分:2)

不要使用<animateColor>,因为它已被弃用。有些UA实施它,有些不执行。

幸运的是,<animate>可以在<animateColor>任意位置使用,语法相同,只需全局搜索并将animateColor替换为animate,您应该全部设置。

答案 1 :(得分:0)

正如所指出的那样,为svg图像设置动画的正确方法是使用animate标签,因为animateColor标签已被删除。

<animate attributeName="fill" attributeType="XML" from="black" to="grey" dur=".5s" repeatCount="indefinite"/>   
<animate attributeName="stroke" attributeType="XML" from="black" to="grey" dur=".5s" repeatCount="indefinite"/>