IE6下Png透明最佳解决方案

【图像处理】

下载

新闻

文章

网络上解决IE6下Png透明解决方案有很多,例如 IE PNG Fix from TwinHelix, Javascript IE PNG Fix, Transparent PNGs in Internet Explorer 6 from 24 ways.等等.

然而现在,我要和你分享的是 Unit PNG Fix .
因为它的确是太出众了.

1.非常小的javascript文件:1kb!
2.解决因为IE的滤镜属性所带来的影响.
3.无论是img元素或background-image属性,都能有效果.
4.在加载页面之前就能自动运行.或者就一丁点的元素.
5.允许自动高宽.
6.使用起来超级简单.

如何使用:

1).下载zip 然后,添加下面的代码到你页面的头部.(一定要确保路径的正确)


2).添加clear.gif到你的images 文件夹中.在js文件中,修改“var clear=”images/clear.gif” 路径,为你存放clear.gif的文件路径.

3). 你的整个项目的png图片都实现了透明效果.的确非常简单吧?就2个步骤,就实现了整个站点所有png的透明效果.
一些注意事项:

Unit PNG Fix能够让 background-repeat在ie6下工作,不过这种工作方式不是像正常的repeat图片重复的效果,而是采用了拉伸的效果.但是,仍然是效果的,所以这也是非常不错的.因为没有任何一个解决方案能够实现ie6下透明滤镜重复图片这个功能.

就这些了,现在你可以开始动手实践了.

官方下载地址

====================================这是一条美丽的水平线=================================

经过测试以上方法只有在背景图片不平铺且，框架与背景一样大时才有效果，如果图片小于框架，背景图片会自动拉大这当然不是我们想要的结果。所以我特地找到了一个解决此问题的方法，请看例子

主要使用到三个文件：iepngfix_tilebg.js blank.gif（空白图片）iepngfix.htc

'使用方法
<script type="text/javascript" src="iepngfix_tilebg.js"></script>
 <style type="text/css">
img{
	behavior: url("iepngfix.htc");
}
#foot{
	background: url(close.png);
	behavior: url("iepngfix.htc");
}
 </style>

如果你改变的文件对应的地址，需要注意一点的就是在iepngfix.htc里有连接blank.gif的参数：IEPNGFix.blankImg = thisFolder + 'blank.gif';如果出不了效果时，请相应改一下地址。正常情况下是不用改的，因为它会自动获取地址，当然这要保证两个文件在一起的时候。

最后说说它的缺点：当你大量使用png图片时，在IE6下可能死机哦，非常点资源！