RSS
people
Jul 14 2010

解决IE6背景图片不缓存的问题

IE6在背景图片缓存上有一个bug：它会每次都从服务器端读取背景图片。例如我们使用a:hover更换背景图片，在IE6下会出现每次鼠标滑过则重新向服务器请求图片，如果服务器反应较慢，那么hover效果就会出现短暂的空白，令人极度不爽。虽然可以通过CSS sprites的方式解决问题的，但效果差强人意。 示例： a{ background:url(normal.gif); } a:hover { background:url(hover.gif); } 如果为超级链接定义上述的css样式以实现鼠标悬浮时的动态效果，在firefox下是没有什么问题的，第一次加载之后，浏览器都会从缓存读取背景图片. 解决方法 具体的解决方法就是在页面中加入一段简单的javascript脚本，告诉IE6：本地有背景图片的话就不要麻烦服务器了。 document.execCommand(“BackgroundImageCache”,false,true); 关于这段脚本的放置方式有两种：

1.使用CSS，在CSS中加入如下代码 html {}{ filter: expression(document.execCommand(“BackgroundImageCache”, false, true)); }

2.使用JS： document.execCommand(“BackgroundImageCache”,false,true);

相关文章

This entry was written by rain and posted on 2010-07-14 at 4:05 pm and filed under Web标准. Bookmark the permalink. Follow any comments here with the RSS feed for this post.

2 Responses to “解决IE6背景图片不缓存的问题”

  1. z4none Says:
    07月 14th, 2010 at 7:58 pm

    补充一下, 用JS方式时最好加上异常处理, 不然有可能导致在非IE浏览器下的错误, 导致之后的JS无效.

    try{
    document.execCommand(“BackgroundImageCache”, false, true);
    } catch(err) {}

  2. rain Says:
    07月 15th, 2010 at 9:54 am

    加上浏览器判断，或者对这个脚本写一个IE6的注释也可以的

Leave a Reply