关于IE6中显示PNG图片不透明问题的解决方案
内容提示:下面主要收集整理了两种让IE6显示透明PNG图片的方法,供大家在实际应用的灵活参考(本站顶部的主频道条就是综合应用的效果):
方法一、通过 css ie滤镜解决
<style type="text/css">
<!--
.pngpic { filter: progid:DXImageTransform.Microsoft.
AlphaImageLoader(src='/pngpic.png',sizingMethod='crop'); }
-->
</style>
方法二、通过 javascript 和 css 滤镜解决 ie 整站 png 背景透明问题
<script type="text/javascript" language="javascript">
function enablePngImages() {
var imgArr = document.getElementsByTagName("IMG");
for(i=0; i<imgArr.length; i++){
if(imgArr[i].src.toLowerCase().lastIndexOf(".png") != -1){
imgArr[i].style.filter = "progid:DXImageTransform.Microsoft.
AlphaImageLoader(src='" + imgArr[i].src + "', sizingMethod='auto')";
imgArr[i].src = "spacer.gif";
}
if(imgArr[i].currentStyle.backgroundImage.lastIndexOf(".png") != -1){
var img = imgArr[i].currentStyle.backgroundImage.substring
(5,imgArr[i].currentStyle.backgroundImage.length-2);
imgArr[i].style.filter = "progid:DXImageTransform.Microsoft.
AlphaImageLoader(src='"+img+"', sizingMethod='crop')";
imgArr[i].style.backgroundImage = "url(spacer.gif)";
}
}
}
function enableBgPngImages(bgElements){
for(i=0; i<bgElements.length; i++){
if(bgElements[i].currentStyle.backgroundImage.lastIndexOf(".png") != -1){
//alert(bgElements[i]);
var img = bgElements[i].currentStyle.backgroundImage.substring
(5,bgElements[i].currentStyle.backgroundImage.length-2);
bgElements[i].style.filter = "progid:DXImageTransform.Microsoft.
AlphaImageLoader(src='"+img+"', sizingMethod='crop')";
bgElements[i].style.backgroundImage = "url(spacer.gif)";
}
}
}
</script>
<img src="pngpic.png" alt="" border="0" />
<!--[if lt IE 7]>
<script type='text/javascript'>
var bgElements;
enablePngImages();
if(bgElements){
enableBgPngImages(bgElements);
}
</script>
<![endif]-->