IE6背景圖片不緩存問(wèn)題解決方案及圖片使用策略多個(gè)方法小結(jié)
更新時(shí)間：2012年05月14日 02:07:07 作者：
最近發(fā)現(xiàn)的Web項(xiàng)目在IE6下出現(xiàn)背景圖片不緩存的問(wèn)題，在網(wǎng)上搜索了一番，發(fā)現(xiàn)已經(jīng)是眾所周知的BUG，這里就總結(jié)一下各種解決辦法
解決方法一：IE6 Hack腳本
<script>
if(navigator.appName == "Microsoft Internet Explorer"){
var b_version=navigator.appVersion;
var version=b_version.split(";");
var trim_Version=version[1].replace(/[ ]/g,"");
if(trim_Version=="MSIE6.0"){
;//alert("IE 6.0");
try {
document.execCommand("BackgroundImageCache", false, fix);
}catch(err){ }
}
}
</script>
解決方法二：IE6 Hack注釋
<!--[if IE 6]>
<script type="text/javascript"><!--
document.execCommand("BackgroundImageCache", false, true);
// --></script>
<![endif]-->
解決方案三：IE6 Hack樣式
html {}
{
filter:expression(document.execCommand("BackgroundImageCache", false, true));
}
但以上方法還不能解決在innerHTML使用圖片不緩存的問(wèn)題，此問(wèn)題的微軟官方解釋參考：http://support.microsoft.com/default.aspx?scid=kb;en-us;319546
解決了背景圖片緩存的問(wèn)題，Web圖片的使用就可以采用CSS的background-image進(jìn)行定義，且采用緩存只訪問(wèn)一次。對(duì)于IMG標(biāo)簽，部分網(wǎng)站采用（寬高均為）1像素的GIF圖片作為SRC值，表示內(nèi)容采用樣式類定義的方式如：
.yahoo
{
background: url('img/yahoo.png') no-repeat;
width:16px;
height:16px;
}
<img src="pixel.gif" class="yahoo"/>
Web應(yīng)用中使用圖片需要考慮問(wèn)題，就是圖片的請(qǐng)求次數(shù)、圖片的尺寸和圖片的清晰度。
復(fù)制代碼 代碼如下:
<script>
if(navigator.appName == "Microsoft Internet Explorer"){
var b_version=navigator.appVersion;
var version=b_version.split(";");
var trim_Version=version[1].replace(/[ ]/g,"");
if(trim_Version=="MSIE6.0"){
;//alert("IE 6.0");
try {
document.execCommand("BackgroundImageCache", false, fix);
}catch(err){ }
}
}
</script>
解決方法二：IE6 Hack注釋
復(fù)制代碼 代碼如下:
<!--[if IE 6]>
<script type="text/javascript"><!--
document.execCommand("BackgroundImageCache", false, true);
// --></script>
<![endif]-->
解決方案三：IE6 Hack樣式
復(fù)制代碼 代碼如下:
html {}
{
filter:expression(document.execCommand("BackgroundImageCache", false, true));
}
但以上方法還不能解決在innerHTML使用圖片不緩存的問(wèn)題，此問(wèn)題的微軟官方解釋參考：http://support.microsoft.com/default.aspx?scid=kb;en-us;319546
解決了背景圖片緩存的問(wèn)題，Web圖片的使用就可以采用CSS的background-image進(jìn)行定義，且采用緩存只訪問(wèn)一次。對(duì)于IMG標(biāo)簽，部分網(wǎng)站采用（寬高均為）1像素的GIF圖片作為SRC值，表示內(nèi)容采用樣式類定義的方式如：
復(fù)制代碼 代碼如下:
.yahoo
{
background: url('img/yahoo.png') no-repeat;
width:16px;
height:16px;
}
<img src="pixel.gif" class="yahoo"/>
Web應(yīng)用中使用圖片需要考慮問(wèn)題，就是圖片的請(qǐng)求次數(shù)、圖片的尺寸和圖片的清晰度。
相關(guān)文章
這篇文章主要介紹了webpack3.0升級(jí)4.0的方法步驟,文中通過(guò)示例代碼介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-04-04
本文主要介紹了10道典型的JavaScript面試題。具有很好的參考價(jià)值。下面跟著小編一起來(lái)看下吧2017-03-03
這篇文章主要為大家詳細(xì)介紹了微信小程序?qū)崿F(xiàn)車牌鍵盤(pán)，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2022-07-07
JavaScript 限制文本框不可輸入英文單雙引號(hào)的方法
這篇文章主要介紹了JavaScript 限制文本框不可輸入英文單雙引號(hào)的方法的相關(guān)資料,需要的朋友可以參考下2016-12-12
JavaScript 2018 中即將迎來(lái)的新功能
JavaScript 2018 中即將迎來(lái)的新功能：異步生成器及更好的正則表達(dá)式。更多常規(guī)正則表達(dá)式功能大家跟隨小編一起通過(guò)本文學(xué)習(xí)吧2018-09-09
這篇文章主要為大家詳細(xì)介紹了JS快速排序的相關(guān)資料，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-04-04
這篇文章主要介紹了詳解JavaScript的另類寫(xiě)法的相關(guān)資料,需要的朋友可以參考下2016-04-04
動(dòng)態(tài)生成的IFRAME，設(shè)置SRC時(shí)的，不同位置帶來(lái)的影響
動(dòng)態(tài)生成的IFRAME，設(shè)置SRC時(shí)的，不同位置帶來(lái)的影響。 以下所說(shuō)的是在IE7下運(yùn)行的。IE6下也是同樣。 在這個(gè)blog中，直接點(diǎn)擊運(yùn)行代碼，和把下面代碼保存到為網(wǎng)頁(yè)在運(yùn)行（以本地文件或域名訪問(wèn)），效果不一樣。2008-03-03
select沒(méi)有只讀屬性，所以需要在select外面包含一個(gè)span，通過(guò)js來(lái)改變,需要的朋友可以參考下2014-04-04
elementUI?Table?自定義表頭動(dòng)態(tài)數(shù)據(jù)及插槽的操作
本文介紹了如何實(shí)現(xiàn)一個(gè)高度自定義的列表界面,其中表格的表頭由后端返回,并且允許用戶根據(jù)需求自定義表頭和數(shù)據(jù)展示樣式,本文給大家介紹elementUI?Table?自定義表頭動(dòng)態(tài)數(shù)據(jù)及插槽的操作,感興趣的朋友跟隨小編一起看看吧2024-10-10