超大 jQuery 插件：预加载器 .gif 图像在 Internet Explorer 7 中不可见
以前有人遇到过这个问题吗？什么是好的解决方案？
我正在使用 Supersized jQuery 插件来加载全屏背景图像。 Supersized 使用 .gif 图像作为基本预加载器。该图像在除 IE 之外的所有浏览器中都显示得很好，在 IE 中它是不可见的。
我该如何解决这个问题？
更新
这就是该 div 的 CSS 外观：
#supersized-loader {
position:absolute;
top:50%;
left:50%;
z-index:10;
width:60px;
height:60px;
margin:-30px 0 0 -30px;
text-indent:-999em;
background-color:#111;
background:rgba(0, 0, 0, 0.8) url(../images/progress.gif) no-repeat center center;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
}
出于某种原因，它在图像顶部呈现背景颜色。当我删除这些时：background-color:#111; background:rgba(0,0,0,0.8) 我可以看到图像。我该如何修改它才能在 IE 中运行？
非常感谢您的建议！
Had anyone experienced that issue before? What would be a good solution?
I'm using Supersized jQuery plugin to load full-screen background image. Supersized uses a .gif image as a basic preloader. That image is displayed perfectly well in all the browsers except IE, where it's invisible.
How do I get this fixed?
UPDATE
This is what CSS looks like for that div:
#supersized-loader {
position:absolute;
top:50%;
left:50%;
z-index:10;
width:60px;
height:60px;
margin:-30px 0 0 -30px;
text-indent:-999em;
background-color:#111;
background:rgba(0, 0, 0, 0.8) url(../images/progress.gif) no-repeat center center;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
}
For some reason it renders the background color on top of the image. When I remove these: background-color:#111; background:rgba(0,0,0,0.8) I can see the image. How can I modify it to make it work in IE?
Would appreciate your advice!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
这个答案是我与 PENDO 讨论的结果（见评论）。显然，IE7 在同一 div 中将动画 .gif 图像呈现在背景颜色下方。另外，jQuery 似乎不允许在前面添加嵌套 div，因此我无法将 loader gif 图像放置在超大插件的背景 div 内。可行的解决方案是在 CSS 中完全删除背景，并将超大插件相对难看的默认 .gif 替换为外观更好且不需要任何背景的 .gif。
This answer is the result of my discussion with PENDO (see comments). Apparently, IE7 renders the animated .gif image below the background color in the same div. Also jQuery doesn't seem to allow to prepend nested divs, and as a result I couldn't place the loader gif image inside the background div in supersized plugin. The workable solution was to remove the background completely in CSS and replace the relatively ugly default .gif of supersized plugin with a nicer-looking one that doesn't need any background.