ie下css背景图片加载延迟闪烁
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了ie下css背景图片加载延迟闪烁相关的知识，希望对你有一定的参考价值。
我在用css+div布局网页时，运用分段的图片做背景图，但是ie每次刷新都是先白色再出现我的背景，这样看着很不爽。在网上找了很多时间，大都就那几种方法，还没说情到底代码怎么放。所以希望高手指点一下。代码如下：
<html>
<head>
<title>
</title>
#header-login /*顶部登陆条*/
width:1000px;
height:18px;
background:url(header/image/header-login-bg.gif) repeat-x;
background-repeat: repeat-x;｝
</head>
<body>
<div id="header-login">
主页头部登陆条
</div>
</body>
出现的问题如下：
</html>
加载时先显示白色，然后过1-2秒才显示灰色渐变背景图片的效果。
高手指点一下，修复bug时如果要加代码，怎么加，往哪里加。我是菜鸟，所以要详细。很急！拜托！
下面的我都试了，但是还是不行。谢谢你的回答。继续等待
width:1000px;
height:18px;
background:url(image/header-login-bg.gif) repeat-x top left;｝
看上边的代码，主要有两点，1.最好把那张背景图直接放在同一目录的images下，这样子必免浏览器走弯路找你的图片路径，2.top和left.在写的时候最好还是加上。最后你有一句是重复删掉
忘了说一句不知道你的背景图片多大，越小越好！
这个问题就不是CSS的问题了，我觉的是你的页面加载的东西太多了，而且肯定有由先择行的，导致页面，先执行了由先执行的。这种问题只能用排除，从最有可能的地方一点点的试。不过你可以，先把所有的东西移除，只保留你想要的，看看什么结果 参考技术A
CSS背景图片出现闪动是因为这个样式加在了a:link a:hover等属性上。在IE6中表现为：鼠标移上链接再移开便会出现短暂的闪烁，从HttpWatch和Fiddler中很明显的看到这个鼠标动作加载了两次该背景图片，所以更准确的描述是具有链接属性的背景图片在IE6中闪动和重复加载。
调用JS的execCommand函数即可实现：
可以使用js和css expression调用，考虑到改动成本，采用css expression的方式实现。
鼠标在页面上的移动，页面的滚动都会触发css expression去执行，配置较差的机器上会有性能问题。
如果让页面只在载入时运行一次该表达式，产生的影响就微乎其微了。
解决背景图片闪动和重复加载的IE6BUG ：
将上述样式加入到公用CSS中即可。
答案已发到窗口右上方“我的消息”里，请使用。挺管用的！
完后，效果不好的话，也可考虑系统还原一下（选好还原点）。
-------有人盗用答案 ，无奈只好用这种方式，请理解。 参考技术C css好像本来就是比 html 后加载吧。（我也是好像在哪里看过，找到告诉我吧，嘿嘿）
你找找吧，如果是这样得话。
你可以在html文档里面加样式
或者直接在<body> 标签的属性里加背景
如：
<body background="header-login-bg.gif">
不过想想 这是没必要的。
浏览者进行浏览时本身先注意得应该是网页的文字内容（实体，网页得本质内容） 然后才是图片（美化作用）
希望能帮到你了。
以上是关于ie下css背景图片加载延迟闪烁的主要内容，如果未能解决你的问题，请参考以下文章
延迟加载外部js文件，延迟加载图片（jquery.lazyload.js和echo,js）
Android中ListView异步加载图片错位重复闪烁问题分析及解决方案