我刚刚拍摄了一张简单的图像并尝试对其进行动画处理。它在谷歌浏览器中运行良好，但在火狐的情况下没有显示图像。在这里，我给你js小提琴链接。
<body><div class="icon"></div></body>
其余代码在链接中给出：http: //jsfiddle.net/vvkkumar06/tA7qw/
问问题
1280 次
2 回答
1
MDN 文档中的答案。
http://oli.jp/2010/css-animatable-properties/#background-image
背景图片
这仍然有点悬而未决，当前工作草案中“只有渐变”，当前编辑草案中根本没有背景图像，CSS 背景和边框模块级别中的背景图像“动画：没有” 3 编辑草稿。不过，Chrome 19 Canary 中已经出现了支持，这也是设计师想要的。在得到广泛支持之前，这可以通过图像精灵和背景位置或不透明度来伪造。
此时我发现实际上没有人支持渐变（Chrome 17、FF 12、IE9）。只有 Chrome 支持背景图像（这就是为什么它在 FF 中对我不起作用的原因）。
为背景设置动画
于 2013-07-23T04:19:51.183 回答
0
我认为您应该像这样缩短代码http://jsfiddle.net/DreamBig/tA7qw/4/。我将背景图像放在 div 中，因此您不必在关键帧定义中再次编写 6 或 10 次。
background-image: url('http://www.rotateweb.com/images/WebDesignB1.jpg');
我已经测试过，它在 FF 中完美运行。
于 2013-07-23T04:25:29.917 回答