javascript - 独立 SVG 中的动画(使用 ecmascript(和 jQuery？!))

Question

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

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

Google 找到了无数关于如何使用 XHTML 中嵌入的内联 SVG 的教程，但我有一个独立的 SVG，而 Firefox 提示

Error: b.style is undefined

Source File: [...]jquery.js

Line: 16

有没有办法让 jQuery 正常工作？或者，作为替代方案，您能否推荐我可以使用的另一个 JavaScript 库来实现该目的？

Answer 1

我建议尝试 Raphaël图书馆。该 API 的灵感来自 jQuery，因此您应该很熟悉。

另请记住，IE 不支持 SVG，因此仅支持 SVG 的解决方案无法跨主流浏览器移植。 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 代码。参见 the talk by Dmitry Baranovskiy在 2010 年 JSConf。