使phpBB中的PNG透明图片支持IE6

PNG档案已经愈来越普遍,FireFox从1.0版就已经支持具有alpha透明图片,其他Safari 、Opera 也支持,而目前微软的IE7,IE8才有支持,但微软却不对旧版的IE5.5与6版进行更新支持。(具体表现就是本来透明的PNG图片在IE5.5与6版中看上去非透明)

如果你想在论坛中也希望能够让使用旧版IE的使用者,能够看到PNG图文件具有alpha透明图片。

特别声明此JS发布网站为 http://homepage.ntlworld.com/bobosola/index.htm 关于更多细节可以去参考(英文版)

1.将下列JS语法拷贝

function correctPNG() // correctly handle PNG transparency in Win IE  5.5 & 6.
{
var arVersion = navigator.appVersion.split("MSIE")
var version = parseFloat(arVersion[1])
if ((version >= 5.5)  && (document.body.filters))
{
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); 

2.用UltraEdit或纯文本文件开新文件贴入,并另存新档案为 pngfix.js

备注:上述原文内容中这段 version >= 5.5,根据我的测试,版本大于等于5.5,其实这样写不妥,因为包含以上7-8版本都会被牵连,我发现它会影响到类似这种 function MM_swapImgRestore()图片特效造成失效,因此我建议改为version <= 6,小于等于6版本,就搞定!

3.再将pngfix.js档案放入你的phpbb根目录内

4.打开你所使用的风格目录夹中的 overall_header.html文件,寻找以下代码:

</head>

在如上代码之前加入如下代码:

<script language="JavaScript" type="text/javascript" src="pngfix.js"></script>

完成,存档。

PS:此外挂不影响有支持PNG的浏览器,仅针对IE5.5与6。

参考链接:

  1. [外掛] 論壇在 IE6 能支援PNG的透明圖片方式:http://phpbb-tw.net/phpbb/viewtopic.php?f=104&t=51449
  2. png在IE6下的解决办法:http://blog.csdn.net/newflypig/archive/2008/12/10/3492895.aspx

分类:Web

标签:, , ,

已有 1 人 对 ”使phpBB中的PNG透明图片支持IE6” 进行了评论

  1. 看完了,不错

    [Reply]

对本文发表评论





4 + 8 = ?

注意:
1、请勿单纯发表顶啊、打酱油之类无任何意义的评论,否则将被视为spam!谢谢合作!
2、但欢迎你留下对本文的看法或技术上的任何疑问,我会及时回复你。