Home/ Questions/Q 637205
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-13T20:35:55+00:00

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

  • 0

CSS Code:

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

JavaScript/jQuery:

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

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.

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.

What is the solution?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    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.

    • 0