解決IE6的PNG透明JS插件使用介紹
更新時間:2013年04月17日 16:45:29 作者:
IE6的PNG透明是個老問題了,最近有朋友問我有沒有最好的解決這個問題的插件,今天抽空把這個發(fā)上來
IE6的PNG透明是個老問題了,最近有朋友問我有沒有最好的解決這個問題的插件。雖然知道且在用DD_belatedPNG這個插件,今天抽空把這個發(fā)上來。
雖然之前在博客里發(fā)過一款jquery的png插件,但是不支持背景平鋪。
DD_belatedPNG使用了微軟的VML語言對PNG圖片進(jìn)行重新繪制,以達(dá)到半透明的效果,并且能支持background-position和background-repeat屬性,支持偽類。是一款不錯的值得推薦的插件,用法也比較簡單。
使用方法:
<!--[if IE 6]>
<script src="DD_belatedPNG.js"></script>
<script>
DD_belatedPNG.fix('.png_bg');
</script>
<![endif]-->
引用函數(shù)是DD_belatedPNG.fix(),括號里的 .png_bg 改成你的css選擇器名稱。
ID選擇器例子:
DD_belatedPNG.fix('#png');
偽類例子:
DD_belatedPNG.fix('.png a:hover,.png a:focus');
img標(biāo)簽例子:
DD_belatedPNG.fix('img');
如果是多個直接加逗號(英文下的)就行。例如:
DD_belatedPNG.fix('.png_bg,#png,.png a:hover,.png a:focus,img');
使用方法:
<!--[if IE 6]>
<script type="text/javascript" src="js/dd_png.js"></script>
<script type="text/javascript">
DD_belatedPNG.fix('.tel,.head_content');
</script>
<![endif]-->
括號里的是樣式選擇器,中間用逗號隔開
JS文件下載地址:
0.0.8a-min.js (壓縮版)
雖然之前在博客里發(fā)過一款jquery的png插件,但是不支持背景平鋪。
DD_belatedPNG使用了微軟的VML語言對PNG圖片進(jìn)行重新繪制,以達(dá)到半透明的效果,并且能支持background-position和background-repeat屬性,支持偽類。是一款不錯的值得推薦的插件,用法也比較簡單。
使用方法:
復(fù)制代碼 代碼如下:
<!--[if IE 6]>
<script src="DD_belatedPNG.js"></script>
<script>
DD_belatedPNG.fix('.png_bg');
</script>
<![endif]-->
引用函數(shù)是DD_belatedPNG.fix(),括號里的 .png_bg 改成你的css選擇器名稱。
ID選擇器例子:
復(fù)制代碼 代碼如下:
DD_belatedPNG.fix('#png');
偽類例子:
復(fù)制代碼 代碼如下:
DD_belatedPNG.fix('.png a:hover,.png a:focus');
img標(biāo)簽例子:
復(fù)制代碼 代碼如下:
DD_belatedPNG.fix('img');
如果是多個直接加逗號(英文下的)就行。例如:
復(fù)制代碼 代碼如下:
DD_belatedPNG.fix('.png_bg,#png,.png a:hover,.png a:focus,img');
使用方法:
復(fù)制代碼 代碼如下:
<!--[if IE 6]>
<script type="text/javascript" src="js/dd_png.js"></script>
<script type="text/javascript">
DD_belatedPNG.fix('.tel,.head_content');
</script>
<![endif]-->
括號里的是樣式選擇器,中間用逗號隔開
JS文件下載地址:
0.0.8a-min.js (壓縮版)
相關(guān)文章
基于canvas實(shí)現(xiàn)的鐘擺效果完整實(shí)例
這篇文章主要介紹了基于canvas實(shí)現(xiàn)的鐘擺效果,以完整實(shí)例形式分析了JavaScript結(jié)合html5的canvas技術(shù)實(shí)現(xiàn)鐘擺動態(tài)旋轉(zhuǎn)效果的方法,需要的朋友可以參考下2016-01-01Chrome中模態(tài)對話框showModalDialog返回值問題的解決方法
chrome中彈出模態(tài)對話框,通過window.returnValue賦返回值關(guān)閉后,有的情況下無法取得返回值。2010-05-05javascript作用域鏈(Scope Chain)用法實(shí)例解析
這篇文章主要介紹了javascript作用域鏈(Scope Chain)用法,結(jié)合實(shí)例形式較為詳細(xì)的分析了javascript作用域鏈(Scope Chain)的概念、功能與相關(guān)使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-11-11Javascript將雙字節(jié)字符轉(zhuǎn)換成單字節(jié)字符并計算長度
這篇文章主要介紹Javascript將雙字節(jié)字符轉(zhuǎn)換成單字節(jié)字符并計算長度的方法,簡單實(shí)用,需要的朋友可以參考下。2016-06-06js判斷數(shù)組中是否包含某個值的4種方法總結(jié)
這篇文章主要給大家總結(jié)介紹了關(guān)于js判斷數(shù)組中是否包含某個值的4種方法,數(shù)組是我們編程中經(jīng)常使用的的數(shù)據(jù)結(jié)構(gòu)之一,在處理數(shù)組時我們經(jīng)常需要在數(shù)組中查找特定的值,JavaScript 包含一些內(nèi)置方法來檢查數(shù)組是否有特定的值或?qū)ο?需要的朋友可以參考下2023-11-11