使 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]

对本文发表评论





0 + 9 = ?

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