Question

我试图将几张图片放在另一张图片的顶部，然后我将这些图片淡入淡出，这是我的css：

#spark1 {
    bottom: 211px;
    left: 252px;
    position: relative;
    width: 75px;
}
#spark2 {
    bottom: 100px;
    left: 286px;
    position: relative;
    width: 50px;
}

我的HTML：

<div id="spark1">
    <img src="clientside/images/big_sparkle.png" />
</div>
<div id="spark2">
    <img src="clientside/images/little_sparkle.png" />
</div>

我的淡入淡出效果（如果这与我面临的问题有关）

$(function(){
    setInterval(function() {
        $('#spark1').fadeOut(800).fadeIn(800);
        $('#spark2').fadeOut(1000).fadeIn(1000);
    }, 2000);
});

在Firefox和Chrome上一切看起来都不错，但是在IE 8上（没有在任何早期版本的IE上测试过），闪光图像的定位错误，它有黑色背景而不是透明，我该如何处理？？感谢

问候

更新

我已经尝试了一些css解决方法，但似乎没有任何工作（可能是因为我以错误的方式应用它：p），但最后我发现了一个轻微方便的解决方案，我把这条线放在我的jquery淡入淡出效果之后：< / p>

$("#spark1").css('filter', 'none');

这个css给我的img：

#spark1 img{
        background: transparent;
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)";  IE8    
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);    IE6 & 7 */      
        zoom: 1;
    }

感谢pekka指出我的文章，我想我现在要坚持这个解决方案

Answer 1

如果您的PNG具有Alpha透明度，实际上甚至在IE8中仍存在一个错误：具有Alpha透明度的图像不能透明（=给出除{1}以外的opacity值。

有关背景信息和解决方法，请参阅this question。

IE8上的定位和图像透明度失败

1 个答案: