CODEWITHSUNDEEP
jquerycross-browseropacity
user1040259
user1040259

Reputation: 6509

JQuery cross browser opacity (fadeTo) IE 7 & 8 png

I know this topic has been addressed several times here, however my problem is different (or possibly I missed it somewhere?).

My issue is that I need a cross browser way to set opacity and have it not show a black background on the transparent pngs (IE7 and 8).

Several here suggested:

$(this).fadeTo(0, 0.5);

however like I said above.. it displays black on the png.

Thanks.

Upvotes: 0

Views: 248

Answers (1)

T.J. Crowder
T.J. Crowder

Reputation: 1074295

I don't think this has anything to do with fadeTo, which is about the overall opacity of an element. Basically, what you have to do is get IE to understand the alpha channel of PNGs at all so it understands the bits that should be transparent, which requires some IE-specific CSS:

img {
  filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(...);
}

Details (just a couple of links; but if you search for "IE" "png" "transparency" you'll find a huge amount of information):

Upvotes: 2

Related Questions