Jquery和IE8动画不透明度解决方案

时间:2012-08-01 14:25:26

标签: javascript jquery

我正在尝试使用Jquery设置不透明度,并且它在每个浏览器中工作正常,除了,你猜它可怕 IE8
问题:在动画上我看到一些丑陋的文物:(
我知道我可以通过删除背景并为我的动画div和我的容器div添加相同的背景颜色来解决这个问题,但在我的情况下它是 NOT 一个选项。
有人可以建议解决这个问题吗? 我的代码:

$(document).ready(function() {
    $(".img").animate({
        opacity: 0
    });
    $(".glow").click(function() {
        $(".img").animate({
            opacity: 1
        }, 5000);
    });
});

2 个答案:

答案 0 :(得分:2)

通过在我的CSS中添加IE过滤器,我已经部分解决了这个问题(现在更好,没有黑晕)。
因此失去了一整天,所以我希望它会帮助一个比我更幸运的人:)

 .img{
 display:block;
 width:230px;
 height:300px;
 owerflow:hidden;
 position:relative;
 outline:none;

 /*Notice (ugly) IE filter here and Source to my PNG image */

 filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=http://www.robertpeic.com/glow/glow.png) alpha(opacity=0);
 background:none;
 margin:0px auto;
 padding-top:10px;

 }

答案 1 :(得分:1)

这是您在IE7和IE8中使用Alpha透明度更改图像的不透明度时获得的结果。还有一个关于同一IE GIF/PNG Transparency issue with jQuery

的问题