将SVG图像嵌入到网页中：FF中的不同行为

Question

我一直在尝试将一个简单的动画SVG图像嵌入到HTML网页中并取得了成功。在浏览了一下网页后，我发现了很多方法，并在下面的示例中包含了一些内容：http://www.theinsanewonderland.com/loli/mekakucityactors/index_test.html

但是在我的 Firefox （v.31,64bit，Ubuntu）上，这种行为非常不一致：

• <object>：行为符合预期，即显示背景图片，动画按预期工作（双手一次+/- 30秒）。
• <img>：未加载背景图片;动画在大约20°后冻结，然后在几秒钟后重置（但在整个30年的环球航行过去之前）。
• <div> background：与<img>
相同
• <iframe>：与<object>
相同

有人对此有任何经验并可以解释这些差异吗？您是否观察到与其他浏览器相同的效果？

PS： 刚试过 Chromium ，一切都很好，一致。

Answer 1

当用作图像，即CSS背景或通过<img>标记时，SVG文件必须在单个文件中完成。您需要将jpeg背景图像文件作为data uri嵌入SVG文件本身。

动画问题是我前一段时间修复的bug 1067375的一个例子。修复程序将出现在Firefox 35中，将于1月12日发布。如果您愿意，可以立即下载early beta release。