独立 SVG 中的动画(使用 ecmascript(和 jQuery?!))
我使用 inkscape 创建了一个 SVG,现在我想根据一些逻辑添加一些动画。
我非常了解 JavaScript,并且对 jQuery 有基本的经验。所以我想我也可以使用 jQuery 为我的 SVG 制作动画。
Google 找到了无数关于如何使用嵌入 XHTML 中的内联 SVG 的教程,但我有一个独立的 SVG,而 Firefox 抱怨
错误:b.style 未定义
源文件:[...]jquery.js
行:16
有没有办法让 jQuery 工作?或者,作为替代方案,您可以推荐另一个我可以使用来实现目的的 JavaScript 库吗?
I created an SVG using inkscape and now I want to add some animation according to some logic to it.
I know JavaScript quite well and have basic experience with jQuery. So I thought I can animate my SVG with jQuery as well.
Google finds countless tutorials on how to work with inline SVG embedded in XHTML, but I have a stand-alone SVG and Firefox complains
Error: b.style is undefined
Source File: [...]jquery.js
Line: 16
Is there a way to get jQuery working? Or, as an alternative, can you recommand another JavaScript library I could use that fulfills the purpose?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
我建议尝试 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 代码。请参阅 Dmitry Baranovskiy 在 JSConf 2010 上的演讲。
I would recommend to try the Raphaël library. The API was inspired by jQuery so it should be familiar to you.
Also keep in mind that IE doesn't support SVG so having an SVG-only solution won't be portable across major browsers. Raphaël takes care of it for you - it uses VML on IE and SVG on other browsers. It works on Firefox 3.0+, Safari 3.0+, Chrome 5.0+, Opera 9.5+ and Internet Explorer 6.0+.
You can create SVG using Inkscape and then import the paths to your Raphaël code. See the talk by Dmitry Baranovskiy at JSConf 2010.
我同意最后一个答案。 的转换器中
http://irunmywebsite.com/raphael/svgsource.php
将您的 SVG 放入 会将您的 SVG 转换为 html4,并且适用于除 android 之外的所有浏览器。
您可以使用 Raphael 为路径设置动画。
转换器的输出都是 Raphael / SVG / VML
I agree with the last answer. Drop your SVG into the converter at
http://irunmywebsite.com/raphael/svgsource.php
This will put your SVG into html4 and it will work on all browsers except android.
You can animate the paths with Raphael.
The output from the converter is all Raphael / SVG / VML