jquery – 如何解决/ hack衰落半透明PNG错误在IE8?

前端之家收集整理的这篇文章主要介绍了jquery – 如何解决/ hack衰落半透明PNG错误在IE8?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如你所知,IE6有错误,不能显示半透明PNG文件,而不使用非标准样式像过滤器。在IE7中,这个问题是固定的。但它仍然有一些关于PNG文件错误。它无法正确显示渐变半透明PNG文件。你可以清楚地看到它,当你使用show / hide功能在jQuery与半透明PNG文件。图像的背景以不透明的黑色显示

你有任何想法,通过使用jQuery解决这个问题。

更新

让我们来看看我的测试

如你所见,IE8总是不正确地显示PNG-24图像。此外,IE8仍然正确显示PNG-8图像时,我褪色(jQuery.fadeOut功能)它只。但它不正确地显示PNG-8图像时,我褪色&调整大小(jQuery.hide函数)。

PS。您可以从here下载我的测试源代码

谢谢,

解决方法

嘿,我不知道你是否还在寻找答案。几天前,我有同样的问题动画一个与PNG图像里面的div。我试过很多解决方案,唯一一个工作正常是一个我自己编码。

问题似乎是IE缺乏不透明度支持和适当的PNG支持,所以它打破了PNG显示应用不透明效果后(我相信动画框架依赖于固有的MSIE过滤器“AlphaImageLoader”为IE的不透明效果)。奇怪的事情(对我来说,仍然不是很了解)是这个问题可以解决使用相同的过滤器加载动画之前的图像。

我写了一个简单的javascript,将过滤器应用于每个图像.PNG扩展名。我的动画在IE上运行良好。

我复制下面的代码。我有框架独立(它是纯JavaScript),但你必须把它放在你的框架的DOM就绪事件(或使用domready.js,就像我做的)。

var i;
for (i in document.images) {
    if (document.images[i].src) {
        var imgSrc = document.images[i].src;
        if (imgSrc.substr(imgSrc.length-4) === '.png' || imgSrc.substr(imgSrc.length-4) === '.PNG') {
            document.images[i].style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled='true',sizingMethod='crop',src='" + imgSrc + "')";
        }
    }
}

请让我知道如果工作罚款,如果动画运行顺利。亲切的问候!

原文链接:https://www.f2er.com/jquery/185025.html

猜你在找的jQuery相关文章