ie中的jQuery不透明度问题答案

【问题标题】：jQuery opacity problem in ieie中的jQuery不透明度问题
【发布时间】：2011-10-12 11:44:58
【问题描述】：

我只在 IE 中得到这个有线别名文本和图像边框，你可以在图像中看到。

正如您在 javascript 中看到的，我使用的是 jQuery 和 css(opacity)。

这是我的html：

<div id="banner-container">
    <div id="banner-0" class="banner">
        <div class="banner-text">
            <div class="banner-text-heading-3">0 Lorem ipsum dolor si</div>
            <div class="banner-text-text-3">0 Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea <br /><b>Learn more</b></div>
        </div>
        <div class="banner-image"><img src="images/banner-img.png" border="0" /></div>
    </div>
    <div id="banner-1" class="banner">
        <div class="banner-text">
            <div class="banner-text-heading-3">1 Lorem ipsum dolor si</div>
            <div class="banner-text-text-3">1 Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea <br /><b>Learn more</b></div>
        </div>
        <div class="banner-image"><img src="images/banner-img1.png" border="0" /></div>
    </div>
    <div id="banner-2" class="banner">
        <div class="banner-text">
            <div class="banner-text-heading-3">2 Lorem ipsum dolor si</div>
            <div class="banner-text-text-3">2 Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper suscipit lobortis nisl ut aliquip ex ea <br /><b>Learn more</b></div>
        </div>
        <div class="banner-image"><img src="images/banner-img2.png" border="0" /></div>
    </div>   
</div>

jQuery 代码：


$(document).ready(function(){
    slide_logic(0,3,0);
});
function slide_logic(slide,nof_slides,animation_duration)
{
    for(i=0;i<nof_slides;i++)
    {
        if(i==slide)
        {
            $('#banner-'+i).animate({'opacity':'1'},animation_duration);
            $('#banner-'+i+' .banner-text').animate({'opacity':'1'},animation_duration);
        }
        else
        {
            $('#banner-'+i).animate({'opacity':'0'},animation_duration);
            $('#banner-'+i+' .banner-text').animate({'opacity':'0'},animation_duration);
        }
    }
}

有什么解决办法吗？

【问题讨论】：

我之前也遇到过这个问题 - 你有没有为 IE 设置任何背景颜色？
IE8 及更早版本对不透明度的支持非常差。这个事实无可避免。它有问题并且执行不力。 JQuery 可能更容易使用，但它无法修复错误。
@SolMan，没有背景颜色。

标签： jquery internet-explorer text opacity

【解决方案1】：

在这里查看答案：jQuery fadeIn leaves text not anti-aliased in IE7

也许会有所帮助。看来它可能是IE的错误（照常）

【讨论】：

+1，感谢您的回复。我在动画 if($.browser.msie) this.style.removeAttribute('filter'); 的回调中添加了以下代码它解决了不制作动画时的问题，但在制作动画时解决了同样的问题。