Question

我花了最后4个小时试图为透明图像实现所有IE8修复程序。不幸的是，他们都没有工作。

以下是测试网址：http://www.bluegrassbackingtracks.com/stage/

当您在IE8中滚动图标时，可以看到图像上添加了黑色边框。

我非常感谢任何可以帮助我们的人。

Answer 1

这个问题似乎更多关于jQuery和IE的淡入/淡出透明度问题。

请查看此信息以供参考：jquery IE Fadein and Fadeout Opacity

为了帮助IE，如果你可以将图像放在div中并将淡入淡出应用到div而不是你应该得到你想要的效果。将淡入淡出应用于背景图像时可能存在透明度问题。

尝试这样的东西。您还需要调整一下jQuery。

<ul class="img_list">
    <li class="image_two">
        <a href="category.php?id=2">
            <div class="overlay"><img src="images/buttontwo-overlay.png" alt="" width="136" height="176" /></div>
            <img src="images/buttontwo.png" alt="" width="136" height="176" />
        </a>
    </li>
</ul>

Answer 2

在该网站上有很多代码要通过，如果您可以在此处发布相关代码，那么查看问题会更加容易。

在此之前，这可能会解决您的问题：

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 + "')";
        }
    }
}

将它放在$(function () {});中，它应该为每个图像添加滤镜，以便不透明度不会变得混乱并产生黑色。

如果这不起作用，请查看：jquery cycle IE7 transparent png problem。

Answer 3

为图像定义纯色背景色：

    .container img {
         background-color: white;
    }

将图片的 background-image css属性定义为 src 属性：

    $('.holder-thumbs li a img').each(function() {
         $(this).css('background-image', $(this).attr('src'));
    });

优点：您无需更改标记

缺点：有时使用纯色背景并不是一种可接受的解决方案。它通常适合我。

jQuery在IE8中使用透明图像淡入/淡出错误

3 个答案: