Internet Explorer上的透明PNG动画问题 [英] Transparent PNG animate problem on Internet Explorer

问题描述

CSS代码：

#btn{
  background: url(transparent.png) no-repeat;
  filter: alpha(opacity=0);
  -moz-opacity: 0;
  -khtml-opacity: 0;
  opacity: 0;
}

JavaScript / jQuery：

JavaScript/jQuery:

$("#btn").animate({opacity:1,"margin-left":"-25px"});

我对Firefox，Chrome等上面的代码没有任何问题。但它不适用于任何版本的Internet Explorer。

I don't have any problem with the code above on Firefox, Chrome and others. But it does not work on any version of Internet Explorer.

问题是PNG图像呈现奇怪，透明PNG的背景看起来很黑。当我删除不透明效果时，没有问题。

The problem is the PNG image is rendered strange, background of the transparent PNG looks black. When I remove opacity effect, there is no problem.

解决方案是什么？

推荐答案

目前我还没有解决这方面的问题。只需要等待IE赶上世界其他地方。几天前我不得不在最近的一个项目中放弃这样的功能。遗憾的是，你无法使用带有IE淡入淡出和淡出jQuery的羽毛边缘PNG。

There is currently no solution for this that I'm aware of. Just have to wait for IE to catch up with the rest of the world. I had to abandon such a feature in a recent project just days ago. You unfortunately cannot have a feathered-edge PNG with IE fading in and out with jQuery.

这篇关于Internet Explorer上的透明PNG动画问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！