含有透明部分的PNG图片在网页中正常显示

目前大部分浏览器对PNG的支持并不完善,IE虽然可以显示PNG图片，但如果PNG图片中含有透明部分，那么透明部分的显示就不正常了。
盗版它人网站的内容可耻，您查看的内容来源于★点击设计★www.djasp.Net
解决这个问题大致有以下方法(其原理都是通过AlphaImageLoader滤镜来解决)。
盗版它人网站的内容可耻，您查看的内容来源于★点击设计★www.djasp.Net
方法一:
盗版它人网站的内容可耻，您查看的内容来源于★点击设计★www.djasp.Net
<div style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/images/header.png);width:200px;height:50px"></div>
此内容来源于 ★点击设计★ http://www.djasp.Net 网页编程资讯官方网站！
点评:这种方法虽然较好的解决了IE 5+的浏览器，但却得本来能正常显示透明PNG图片的FireFox无法正常显示!
本文由 ★点击设计★ http://www.djasp.Net　收集整理。谢绝无聊之人转载！
方法二:
本文由 点击设计 http://www.djasp.Net　收集整理。谢绝无聊之人转载！
<script type="text/javascript">
// PNG纠正控件 1.0 For IE 5.5或更高.
// 作者:舜子
本文由 ★点击设计★ http://www.djasp.Net　收集整理。谢绝无聊之人转载！
function isIE(){
if (navigator.appName!="Microsoft Internet Explorer") {return false}
return true
}
★点击设计★ http://www.djasp.Net 专业的WEB编程资讯技术站点，欢迎访问！
function correctPNG() 
{
   for(var i=0; i<document.images.length; i++)
   {
   var img = document.images[i]
   var LW=img.width
   var LH=img.height
   var imgName = img.src.toUpperCase()
   if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
   { 
         img.style.filter+="progid:DXImageTransform.Microsoft.AlphaImageLoader(src="+img.src+", sizingmethod=scale);" 
         img.src="/images/transparent.gif"//transparent.gif为1px*1px的透明gif图片
         img.width=LW
         img.height=LH
   }
   }
}
if (isIE()) {window.attachEvent("onload", correctPNG);}
</script>
本文由 ★点击设计★ http://www.djasp.Net　收集整理。谢绝无聊之人转载！

点评:这种方法确实能解决这个问题，但是如果不是在本地调试，通常需要一段时间的转换!
盗版它人网站的内容可耻，您查看的内容来源于★点击设计★www.djasp.Net

方法三:
本文由 点击设计 http://www.djasp.Net　收集整理。谢绝无聊之人转载！
<div id="header"><!--此DIV为需要插入PNG图片的区域-->
<script type="text/javascript">
if (navigator.appName!="Microsoft Internet Explorer") {
document.write("<img src=\"/images/header.png\" width=\"200\" height=\"50\" alt=\"站长吧 Master8.NET\" />");
} else {
document.write("<img style=\"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/images/header.png, sizingmethod=scale);width:200px;height:50px;\" src=\"{$rootpath}/images/transparent.gif\" width=\"200\" height=\"50\" alt=\"站长吧 Master8.NET\" />");
}
</script>
<div>
点评:事实上网页中绝对需要使用透明PNG图片的地方并不多，所以如果你的网页中仅仅是一两处使用透明PNG图片，建议用这种方法。
本文由 点击设计 http://www.djasp.Net　收集整理。谢绝无聊之人转载！
如果浏览者禁用了js,方法二和三当然失去了作用。针对方法三，可以做一些完善:
此内容来源于 ★点击设计★ http://www.djasp.Net 网页编程资讯官方网站！
<div id="header">
<div id="Index_header">图片简要说明,正常浏览本站请不要禁用js</div>
<div>
本文由 ★点击设计★ http://www.djasp.Net　收集整理。谢绝无聊之人转载！
<script type="text/javascript">
if (navigator.appName!="Microsoft Internet Explorer") {
document.all.Index_header.innerHTML="<img src=\"/images/header.png\" width=\"200\" height=\"50\" alt=\"站长吧 Master8.NET\" />"
} else {
document.all.Index_header.innerHTML="<img style=\"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=/images/header.png, sizingmethod=scale);width:200px;height:50px;\" src=\"/images/transparent.gif\" width=\"200\" height=\"50\" alt=\"站长吧 Master8.NET\" />"
}
</script>
★点击设计★ http://www.djasp.Net 专业的WEB编程资讯技术站点，欢迎访问！
这样如果js能正常运行，’图片简要说明,正常浏览本站请不要禁用js’将被图片替换。然而令人遗憾的是:document.all.Index_header.innerHTML在FireFox中不能被正常运行:(
盗版它人网站的内容可耻，您查看的内容来源于★点击设计★www.djasp.Net
上述方法是本人在实践中的一点总结，由于浏览器的差异，可以说都不尽完善，这是这个年代无法回避的问题。如果您还有更好的方法，望不吝赐教!