javascript - 没有 Canvas 的 HTML 动画序列

Question

我目前正在计划一个 Web 元素，其中包含一些需要在网站上运行的动画序列。 我需要该网站尽可能跨浏览器兼容(呃!)，并希望让其他开发人员考虑不同的选择。

Canvas 不是一个选项，主要是因为 IE。仅对 IE9+ 的支持还不够好，尽管 IE 浏览器统计数据的“进展”近乎可笑 http://www.w3schools.com/browsers/browsers_stats.asp (2013 年 3 月 IE 的 13%(所有 WINDOWS 机器的默认设置)稍微偏离主题......

我计划为动画的不同阶段预加载一系列动画 gif，例如“跑”、“走”、“飞”，然后在需要时交换 img 标签的 src。我还没有测试过这样的东西，但我发现即使有预加载的图像也会有延迟(尽管 javascript http://www.preloadjs.com ) 虽然我不太喜欢动画 GIFS 的质量。将这个想法更进一步，使用相同的方法，但每个来自单独的 PNG？可行吗？

或者 DOM 元素是否可以附加一个 spritesheet 作为背景图像，改变每一步的背景位置？

任何想法或例子 ;) 都会很有帮助! :)

干杯， 罗里!

---编辑

我也对不同的 javascript 库开放.. 虽然目前我的元素中包含 jQuery和 Rapheal

Answer 1

jQuery animate将是您最好的选择。如果你有时间生成一个 sprite 表来显示不同的动画阶段，那么你可能有足够的时间研究一个好的 jquery 插件，比如 gameQuery。 ，它允许您为 sprite 表项设置动画。