JavaScript-IE6 png8 图片 灰色底

小组聊天灌水 小组聊天灌水 主题:993 回复:2175

JavaScript-IE6 png8 图片 灰色底

甜柠檬 发布于 2017-02-20 字数 1610 浏览 1099 回复 2

IE6 png8图片去掉灰色底
我用了网上

<script type="text/javascript">  
function correctPNG()
{
for(var i=0; i<document.images.length; i++)
{
var img = document.images[i]
var imgName = img.src.toUpperCase()
if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
{
var imgID = (img.id) ? "id='" + img.id + "' " : ""
var imgClass = (img.className) ? "class='" + img.className + "' " : ""
var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
var imgStyle = "display:inline-block;" + img.style.cssText
if (img.align == "left") imgStyle = "float:left;" + imgStyle
if (img.align == "right") imgStyle = "float:right;" + imgStyle
if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle
var strNewHTML = "<span " + imgID + imgClass + imgTitle
+ " style="" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
+ "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
+ "(src='" + img.src + "', sizingMethod='scale');"></span>"
img.outerHTML = strNewHTML
i = i-1
}
}
}
window.attachEvent("onload", correctPNG);
</script>

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

支持 Markdown 语法,需要帮助?

评论(2

瑾兮 2017-06-28 2 楼

推荐使用DD_belatedPNG.js

<!--[if IE 6]>
<script src="js/DD_belatedPNG.js" mce_src="DD_belatedPNG.js"></script>
<script type="text/javascript">
/ EXAMPLE /
DD_belatedPNG.fix('.png_bg');
/ 将 .png_bg 改成你应用了透明PNG的CSS选择器,例如我例子中的'.trans'/
</script>
<![endif]-->

使用IE的html条件注释方式针对IE6做hack。
http://www.yzznl.cn/archives/ie6-png-transparent.html

http://www.dengpeng.org/archives/655

归属感 2017-03-31 1 楼

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml"&gt;
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>PNG透明解决方案</title>
<style type="text/css">

body { margin: 0px; background:url(http://www.imeetyou.net/img/bg1.gif) }

/第一种适用于背景的时候/
.first { width:400px; margin:0 auto; height:300px; background:url(http://www.imeetyou.net/img/bg1.png); }

/第二种适用于页面放PNG图的时候/
.second { width:300px; height:200px; text-align:center; margin:30px auto; background:#999933; }
/-------------IE6-PNG透明------------------------/

  • html img,

  • html .png{
    behavior: expression((this.runtimeStyle.behavior="none")&&(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none",
    this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')",
    this.src = "http://www.imeetyou.net/img/transparent.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("','').replace('")',''),
    this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')",
    this.runtimeStyle.backgroundImage = "none")),this.pngSet=true)

    );
    }
    /-------------------------------------------/
    </style>
    </head>
    <body>
    <div class="first"></div>
    <div class="second"><img src="http://www.imeetyou.net/img/1.png" width="271" height="88" /></div>
    </body>
    </html>