小虾虎鱼

小虾虎鱼

jquery插件DD_belatedPNG使IE6支持PNG透明

作者 禾惠 发表于 2012/09/04,最后修改于 2012/09/04

    使IE6支持PNG透明的方法有很多,有滤镜、e­xpression、javascript+透明GIF替代等方法,在使用的时候都有它们的不足之处。以前使用滤镜的时候可以将图片透明,但最近使用滤镜时老是不起作用,到现在还没有找到原因(估计还是路径的问题)。在很早的时候使用过一个js文件使PNG透明,但那个js只支持img中的图片透明,而无法使背景图片透明。最后问了一下同事,他推荐了一个DD_belatedPNG插件,感觉还不错,下面就分享大家。使用的方法:

1、由于是一款jquery插件,所以毫无疑问head里面要引用jquery库文件;

2、引用DD_belatedPNG.js文件;点此下载插件

3、使用如下代码:

$(function () {
     DD_belatedPNG.fix("*");
});

代码中的星号(*)代表所有的标签,如果使用* 可能会影响网站的性能,建议给需要做透明的图片加一个class,如class="fixPng",然后代码这样写:

$(window).load(function () {
            DD_belatedPNG.fix(".fixPng");
        });

这样相对来说会提高页面的性能。

但是要做PNG透明的只有IE6需要,其他浏览器都支持PNG透明不要上面那段代码,所以我们可以这样写代码:

<!--[if lt IE 7]>
    <script src="js/DD_belatedPNG.js" type="text/javascript"></script>
    <script>
        $(window).load(function () {
            DD_belatedPNG.fix(".fix-png");
        });
    </script>
<![endif]-->

这样在IE6及以下的浏览器中上面那段代码才会执行。

此方法建议使用jquery的网站使用。