为什么在 alpha 动画后 IE 中的图形有难看的黑色边框？答案

【问题标题】：Why does graphics have ugly black borders in IE after alpha animation?为什么在 alpha 动画后 IE 中的图形有难看的黑色边框？
【发布时间】：2010-08-01 03:28:01
【问题描述】：

The site I'm working on 以精美的 jQuery 不透明度动画打开。目前它适用于所有浏览器，但在 IE 中，所有文本和 alpha 图像都留下难看的黑色边框，使文本几乎无法阅读。

我可以运行一些聪明的 javascript 命令来刷新/更新图形吗？有没有其他办法解决这个问题？

我的问题完全是css和javascript相关的，所以所有的源代码都可以在链接之后找到。

感谢您的帮助！

http://xistence.org/dev/

【问题讨论】：

标签： javascript jquery css

【解决方案1】：

在涉及不透明度的动画之后，您将需要清除不透明度值（恢复为无值的默认值）以修复 IE 中这种损坏的抗锯齿。在动画完成后（例如在回调中）在有问题的部分尝试这个 jQuery：

$('.item').css('filter','');

【讨论】：

所以动画在内部提供给 IE 的filter 中将值设置为1，而您只需通过opacity, '' 杀死1，这样它就会变成香草，原封不动，而这会解决黑色故障吗？
重置不透明度没有任何作用，但重置过滤器可以解决问题。谢谢回复！如果您编辑帖子，我会将其标记为正确答案。

【解决方案2】：

这个问题可能有你想要的答案：

jquery cycle IE7 transparent png problem

来自@darkoz 的回答：

解决这个问题的方法是将你的 png 嵌套在一个容器中，然后淡化容器。有点像这样：

<div id="fadeMe">
    <img src="transparent.png" alt="" />
</div>

【讨论】：

【解决方案3】：

这个 jQuery 代码的 sn-p 在处理 IE 中的不透明度问题时非常有用。

    $(function() {
        if (jQuery.browser.msie)
            $('img[src$=.png]').each(function() {
            this.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src="+this.src+",sizingMethod='scale')";
        });
    })

【讨论】：

【解决方案4】：

为图像定义纯色背景色：

.container img { 背景颜色：白色； }

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

$('.holder-thumbs li a img').each(function() { $(this).css('背景图片', $(this).attr('src')); });

优势：您无需更改标记

缺点：有时应用纯色背景颜色不是可接受的解决方案。通常是给我的。

【讨论】：