我已经从Adobe Illustrator输出了一个svg文件,这很好,现在我将该svg文件嵌入到我的html页面中,该svg包含许多不同的路径,我想使用jquery逐个地对它们进行动画处理,而不使用插件,但我不太确定如何实现,因为我没有使用svg的知识,有人可以解释一下应该如何处理吗?
谢谢 Kyle
我已经从Adobe Illustrator输出了一个svg文件,这很好,现在我将该svg文件嵌入到我的html页面中,该svg包含许多不同的路径,我想使用jquery逐个地对它们进行动画处理,而不使用插件,但我不太确定如何实现,因为我没有使用svg的知识,有人可以解释一下应该如何处理吗?
谢谢 Kyle
jQuery不兼容SVG API,但纯JS可以很好地工作。
对于动画效果,您首先必须获得对SVG元素/对象的访问权限。这需要从同一域中提供SVG脚本。如何执行可以在SO的先前答案中找到。
对于动画效果,您可以...
创建SVG动画元素,将其添加到SVG DOM并绑定到您的路径/元素。请参见http://www.w3.org/TR/SVG/animate.html。
通过直接更改所有元素拥有的矩阵来以编程方式执行。请参见http://www.w3.org/TR/SVG/coords.html