独立SVG中的动画(带ecmascript(和jQuery ?!))

我使用inkscape创建了一个SVG,现在我想根据一些逻辑添加一些动画。

我非常了解JavaScript并且具有jQuery的基本经验。 所以我想我也可以使用jQuery为我的SVG制作动画。

Google发现了无数关于如何使用嵌入在XHTML中的内联SVG的教程,但我有一个独立的SVG和Firefox抱怨

错误:b.style未定义

源文件:[…] jquery.js

行:16

有没有办法让jQuery工作? 或者,作为替代方案,您是否可以推荐另一个我可以使用的JavaScript库来实现目的?

我建议尝试Raphaël图书馆。 API的灵感来自jQuery,所以你应该对它很熟悉。

另外请记住,IE不支持SVG,因此只有SVG-only解决方案才能在主流浏览器中移植。 Raphaël为您照顾它 – 它在IE上使用VML,在其他浏览器上使用SVG。 它适用于Firefox 3.0 +,Safari 3.0 +,Chrome 5.0 +,Opera 9.5+和Internet Explorer 6.0+。

您可以使用Inkscape创建SVG,然后将路径导入Raphaël代码。 请参阅JSConf 2010上Dmitry Baranovskiy的演讲。

我同意最后的答案。 将SVG放入转换器中

http://irunmywebsite.com/raphael/svgsource.php

这将把你的SVG放到html4中,它可以在除android之外的所有浏览器上运行。 您可以使用Raphael为路径设置动画。

转换器的输出都是Raphael / SVG / VML