当淡入时,IE在PNG周围显示黑色边框

时间:2011-02-11 18:46:50

标签: jquery fadein

这是我的网站: http://smartpeopletalkfast.co.uk/ppr6/

我有使用jQuery透明度淡化的PNG。 IE8(已经与其他人一起测试过)在PNG显示时会显示黑色边框,而它们会淡入。我知道这是一个公认的问题,我尝试了一些没有运气的方法。

但是,我注意到心脏(最后一个要加载的图像)没有黑色边框。为什么这个好吗?希望如果我弄清楚为什么我可以用它来修复其他人。

谢谢

更新

我玩代码那么多我没有意识到我无意中禁用了内心的淡入淡出,这就是为什么没有边界。

这是一个奇怪的问题。在我所看过的所有论坛中,他们的解决方案似乎对某些人有用,但对其他人则无用。

5 个答案:

答案 0 :(得分:8)

我知道这个帖子很老了,无论如何我发现这个帖子对我很有用,它完全删除了IE7,IE8中PNG的黑色边框。

.item 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 */ 
}

你可以在这个帖子http://www.sitepoint.com/forums/showthread.php?590295-jQuery-fadein-fadeout-of-transparent-png-in-IE7-and-Chrome

中找到它

答案 1 :(得分:4)

将此属性添加到您的代码中,如此

<img src="/someimage.png" alt="yourImageDesc" style="border-style: none" />

答案 2 :(得分:3)

使用PNG-8为我工作。它们是图像的略微白色边框,在实际文件中不是浏览器问题,但在我的情况下,这看起来很好。

答案 3 :(得分:2)

放置背景颜色

background: #E1AE07;
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF)"; /* IE8 */   
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#00FFFFFF,endColorstr=#00FFFFFF);   /* IE6 & 7 */      
    -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
    filter: alpha(opacity=50);
    -khtml-opacity: 0.50;
    -moz-opacity: 0.50;
    opacity: 0.50;

答案 4 :(得分:0)

我在$('div').css('opactiy',0.5);中使用jquery设置元素的不透明度时遇到了同样的问题 我能够通过为所关注的'div'设置一个坚实的背景颜色来解决它。

简单演示:http://jsfiddle.net/mwXs3/3/(在firefox和ie8中进行比较)......