IE6下的PNG图片的透明问题是一个老问题了,解决办法只需要一个的JS文件和一个GIF图片,却困扰着我辈中人。
最近公司网站改版正需要用到,就收藏一下吧。
IE PNG Fix
脚本下载:UUShare(37KB) 官方下载(37KB)
使用方法:
复制iepngfix.htc和blank.gif两个文件到你的网站目录内。
复制下面的代码到你网站的文件中
<style type="text/css">
img, div { behavior: url(iepngfix.htc) }
</style>
注意:其中img、div标签是你要应用PNG透明功能的容器,如你要在超链接内的PNG图片透明化,那么就加上a标签即可,代码改为:
<style type="text/css">
img, div, a { behavior: url(iepngfix.htc) }
</style>
如果你使用子文件夹,改变了blank.gif的路径,那么你可能需要修改.HTC文件,找到下面代码并修改为新的路径:
var blankImg = '/images/blank.gif';
++
<script language=”javascript”>
// 修复 IE 下 PNG 图片不能透明显示的问题
function fixPNG(myImage) {
var arVersion = navigator.appVersion.split(“MSIE”);
var version = parseFloat(arVersion[1]);
if ((version >= 5.5) && (version < 7) && (document.body.filters))
{
var imgID = (myImage.id) ? “id=’” + myImage.id + “‘ ” : “”;
var imgClass = (myImage.className) ? “class=’” + myImage.className + “‘ ” : “”;
var imgTitle = (myImage.title) ? “title=’” + myImage.title + “‘ ” : “title=’” + myImage.alt + “‘ “;
var imgStyle = “display:inline-block;” + myImage.style.cssText;
var strNewHTML = “<span ” + imgID + imgClass + imgTitle
+ ” style=\”" + “width:” + myImage.width
+ “px; height:” + myImage.height
+ “px;” + imgStyle + “;”
+ “filter:progid:DXImageTransform.Microsoft.AlphaImageLoader”
+ “(src=\’” + myImage.src + “\’, sizingMethod=’scale’);\”></span>”;
myImage.outerHTML = strNewHTML;
} }
window.onload=function(){
document.getElementById(“top”).style.height=screen.height/5+”px”;
}//
</script>
使用
<img src=”statics/qhs.png” onload=”fixPNG(this)”/>
调用。
标签: HowTo, IE, PNG, Tips, 建站, 技巧