使用DD_belatedPNG讓IE6支持PNG透明圖片

衆所周知IE6不支持透明的PNG圖片,而PNG圖片在Web設計方面表現力上，具備其 它圖形格式所達不到的效果，IE6這一致命缺陷極大地限制了Web設計的創意發揮。雖然解決IE6的透明PNG的方法也不少,從使用IE特有的濾鏡或是 e­xpression,再到javascript+透明 GIF替代.可是這些方法都有一個缺點,就是不支持CSS中backgrond-position與background-repeat屬性。而使用 DD_belatedPNG.js可完美的解決IE6下PNG圖片透明問題，而且支持backgrond-position與background- repeat. 這是其餘方法所不具有的，同時DD_belatedPNG還支持a:hover屬性,以及<img>。咱們的網站就加入了 DD_belatedPNG處理導航PNG透明圖片,使其在不一樣瀏覽器下保持相同的外觀。

使用方法：

首先下載JS文件

0.0.8a.js (未壓縮版本)

0.0.8a-min.js (壓縮版)

以後在頁面中引用代碼：

1<!–[if IE 6]>
2<script type=」text/javascript」 src=」下載下來的JS路徑」></script>
3<script>
4DD_belatedPNG.fix(‘CSS選擇器, 應用類型’);
5</script>
6<![endif]–>

引用函數是 DD_belatedPNG.fix() , 括號裏分別填寫應用PNG的CSS選擇器（可以使用ID選擇器和類選擇器）和應用類型（分爲img和background兩種）。

如DD_belatedPNG.fix(‘#box-one, img’) 或者 DD_belatedPNG.fix(‘.header, background’) 等。

這些能夠簡寫成 DD_belatedPNG.fix(‘#box-one, .header, img,background’);  。

更多選擇器的如 DD_belatedPNG.fix(‘#box-one, .header,#footer,.box-two a:hover, img,background’);  等等。

另外，爲解決IE6下背景圖閃爍，能夠在頁面中添加以下腳本

 1 <!–[if IE 6]>
 2 <script type=」text/javascript」>
 3 // <![CDATA[
 4 if((window.navigator.appName.toUpperCase().indexOf("MICROSOFT")>=0)&&(document.execCommand))
 5 try{
 6 document.execCommand("BackgroundImageCache", false, true);
 7  }
 8 catch(e){}
 9 // ]]>
10 </script>
11 <![endif]–>

原文連接：http://zmingcx.com/dd_belatedpng-solve-png-images-under-ie6-transparent-application-tutorial.html