Home >  > IE6下png透明的解决方法

IE6下png透明的解决方法

9

似乎已经有段时间没有更新文章了,最近一直研究网站前端技术,SEO方面暂缓跟进,随着SEO行业被建站客户的认可,很多网站公司把它当作了主营业务,在这里我只是想提醒一下SEOer,网站优化是长期坚持的东西,由不得半点松懈,如果依偎的批量生产,那只有死路一条,我们言归正传,分享一下最近朋友提出的IE6下PNG透明问题。

IE6在默认情况下是不支持PNG透明效果的,网上也分享过很多类似的解决方案,测试始终不是很完美,今天就把本人精简出来的IE6下png图片格式透明代码分享给大家。

JavaScript部分:

[html]
<script language="JavaScript">
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 j=0; j<document.images.length; j++)
{
var img = document.images[j]
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
j = j-1
}
}
}
}
window.attachEvent("onload", correctPNG);
</script>
[/html]

记得页面调用JS部分哦。 CSS写法:

[html]
.div{filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/4.png'); /* IE6 */_ background-image: none; /* IE6 */}
[/html]

其中 _ background-image: none; 部分写了HACK仅IE6识别。

相关推荐

关注科技,热血而沉着,极致而纯粹。努力做一个理想主义者。

Comment (9)
Trackback (0)
  1. 诺言 unknowunknow 沙发 2011/04/13 11:29

    很喜欢看你的文章,下次再来

  2. 佛山物流公司 unknowunknow 板凳 2011/04/13 13:24

    来看看大家

  3. 小赞 unknowunknow 地板 2011/04/14 07:43

    非常荣幸的来到你博客!也为您博客增加点人气.嘻嘻![www.9cbc.com|wap流量平台]

  4. 佛山货运公司 unknowunknow 4楼 2011/04/14 10:50

    大家好,我是新来的。。希望大家互相交流

  5. 电商圈 unknowunknow 5楼 2011/05/01 01:18

    seo技术性文章,不错

  6. nhl jerseys unknowunknow 6楼 2011/05/09 01:23

    很感谢博主的分享,让我很受用

  7. 广州佳和胃肠医院 unknowunknow 7楼 2011/07/02 06:44

    支持博主,博主加油哦

  8. 商标查询 unknowunknow 8楼 2011/07/11 09:51

    很给力啊,谢谢啊

  9. 兴宁门诊 Internet Explorer 6.0Windows XP 9楼 2011/08/10 07:51

    谢谢分享!!!!

  • 还没有Trackback

发表评论

*

*