Jquery - PNG图像中的fadeIn（）和fadeOut（）。 IE8中的边框固体（黑色）......？ [英] Jquery - fadeIn() and fadeOut() in PNG image. Border Solid (black) in IE8...?

问题描述

我在div的块中运行fadeIn（）和fadeOut（），其中有一个PNG图像，带有半透明资金（带阴影）。

I am running a fadeIn() and fadeOut() in a block of div where there is a PNG image, with semi-transparent funds (with shadow).

参见 http://jsfiddle.net/k3KUj/8/embedded/

在IE 8中，当你运行fadeIn（）和fadeOut（）时它会出现硬边缘，但很快就会消失。在Firefox中，没关系。

In IE 8, it appears the hard edges when you run the fadeIn() and fadeOut(), but soon disappears. In Firefox, it's OK.

在PNG中应用背景颜色的逻辑（例如，使用上面的链接，背景颜色应该是浅灰色），它可以工作。

Logical to apply a background color in PNG (for example, with the link above, the background color should be light gray), it works.

但是不想在PNG中添加背景颜色。我试图让IE 8中没有出现黑色边框，即使你有PNG图像透明度。

But do not want to put a background color in PNG. I'm trying to get black borders do not appear in IE 8, even if you have a PNG image transparency.

查看论坛，尝试过：

-ms-filter：progid：DXImageTransform.Microsoft.gradient（startColorstr =＃00FFFFFF，endColorstr =＃00FFFFFF）; / * IE8 /

filter：progid：DXImageTransform.Microsoft.gradient（startColorstr =＃00FFFFFF，endColorstr =＃00FFFFFF）; / IE6& 7 * /

zoom：1;

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

并参见 jquery IE Fadein和Fadeout Opacity

$（'＃bloc'）。 css（'filter'，'alpha（opacity = 40）'）;

$('#bloc').css('filter', 'alpha(opacity=40)');

并参见有关IE7 / 8& fadeIn / fadeOut jquery问题png

$（＃bloc）。css（'filter'，'none'）;

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

但是，不起作用。任何新的想法，没有在图像背景中应用任何颜色透明？

But, doesn't work. Any new idea, without applying any color in the image background transparent?

谢谢，Vinicius。

Thanks, Vinicius.

推荐答案

为您的图像定义纯色背景颜色：

Define a solid background color to your image:

    .container img {
         background-color: white;
    }

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

Define the background-image css property of your image to its src attribute:

    $('.holder-thumbs li a img').each(function() {
         $(this).css('background-image', $(this).attr('src'));
    });

优势：您无需更改标记

缺点：有时应用坚实的背景颜色是不可接受的解决方案。它通常适合我。

Disadvantage: sometimes applying a solid background color is not an acceptable solution. It normally is for me.

这篇关于Jquery - PNG图像中的fadeIn（）和fadeOut（）。 IE8中的边框固体（黑色）......？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！