css - css 动画中的图像在 firefox 中显示之前未完全加载

标签 css image firefox animation

我正在设计一个网站布局,该布局使用 CSS 动画、动画延迟和不透明度来实现淡入淡出的图像幻灯片。与此非常相似code .

在 IE 和 Chrome 中,图像完整显示,动画效果完美。然而,在 Firefox 中,每个图像在循环时只显示部分图像。这可以通过 Firefox 或图像链接在 code.io 链接中看到。 http://i60.tinypic.com/24yr536.png

就好像图片在显示之前没有完全下载。

我已经在两台装有 Firefox 35 的 Win7 机器和一台 Win8.1 平板电脑上试过了,结果相同。如果与下载速度有关,我的互联网连接是 ADSL 2+。 我已经尝试在容器函数上使用带有 animation-delay: 3s; 的虚拟动画来给 img 动画加载时间,但这没有用。 更改图像文件大小确实有助于显示更多图像,但仍然缺少一些位。 通过搜索似乎没有其他人遇到此问题,这让我认为这可能只是我计算机上的设置。

到目前为止,我已经设法避免在此页面中使用 javascript,我宁愿保持这种方式,但如果这是唯一的解决方案,我会很乐意考虑。

有什么方法可以让这个幻灯片在 Firefox 中正常显示吗?

最佳答案

看起来这个问题是 Firefox 35 中一个难以复制的错误。 我安装了 36 beta 并解决了渲染问题。

https://bugzilla.mozilla.org/show_bug.cgi?id=1122845

关于css - css 动画中的图像在 firefox 中显示之前未完全加载,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28532682/

相关文章:

javascript - 如何限制 window.Open() 函数的窗口数

image - 在 ASP.Net MVC3 Razor 中将 Viewbag 数据从 View 传递到 Controller

html - 火狐 :before ignores positions

firefox - 无法在 Firefox 36 上启动 webex

html - Firefox 中出现底部滚动条

html - 如何让这个 div 填充文档的整个水平宽度,而不是浏览器窗口?

html - Errno::ENOENT 在帖子#index

mysql - 将 MATLAB 绘图以 PNG、JPG 格式写入 MySQL 数据库

php - Wordpress:按列对帖子进行排序的最佳方式

javascript - 在 JavaScript 中比较两个图像