IE6下CSS背景圖片閃爍的Bug(ie6下的背景圖片緩存問題)
IE6下的背景圖片每次使用都會重新發送請求(非本地),連一個hover效果時候同樣的背景圖片僅僅位置不同而已,ie6都會再次發送請求,這個令人崩潰的事情需要解決掉:
對於ie來說,filter:expression 很強大,能夠實現的功能超級多,但是更對於視效率如生命的程序員來說,它的效率不敢令人恭維,所以有人會用css方法實現ie6下背景圖片緩存,但是這種人也就是崇拜微軟的強大而已:
復制代碼代碼如下:
html {filter:expression(document.execCommand("BackgroundImageCache", false, true));} 當然缺點:可能會使整個頁面的加載速度變慢
大多數人都會選擇js方法實現:
復制代碼代碼如下:
<script type='text/javascript'>
document.execCommand("BackgroundImageCache", false, true);
</script>
缺點:如果在firefox等浏覽器下執行會出錯。
所以需要判斷是否為IE浏覽器,使用jQuery提供的判斷方法如下:
復制代碼代碼如下:
<script type='text/javascript'>
if ($.browser.msie) {
document.execCommand("BackgroundImageCache", false, true);
}
</script>
更簡單的就是使用IE的條件注釋:
復制代碼代碼如下:
<!--[if lt IE 7]>
<script>document.execCommand("BackgroundImageCache",false,true);</script>
<![endif]-->