TTUGoldFOX
TTUGoldFOX

Reputation: 161

IE8 CSS Issue, gray background on images when they are really transparent

Ok, see if you can help me out with this one:

1) Go here: http://thepredatorial.com/DHS/index.php in Google Chrome/Firefox/IE9

2) Everything looks great

3) Go to the same web address in IE8

4) There is a gray background (that matches the outer corners) behind the slides of the slideshow that I can't seem to find out why or get rid of...

Any help?

Upvotes: 0

Views: 561

Answers (2)

TTUGoldFOX
TTUGoldFOX

Reputation: 161

Ok, I ended up fixing it on my own.

Because IE8 had crazy bad PNG transparency issues, I ended up making a png of the entire block above and below the transparent gifs, absolutely positioning it ABOVE everything, then z-indexing everything BUT the banner slides above the absolutely positioned element.

Crude? Maybe. However, now it works beautifully in Firefox, Chrome, IE9, IE8, and FOR GOD KNOWS what reason IE7 as well.

Upvotes: 1

lpd
lpd

Reputation: 2337

IE8 and below has issues with applying transparent effects to already transparent images. It appears your jQuery "cycle" effect is causing this: remove the flashing transparency, remove the grey background.

Since IE's dev tools are fairly crappy I couldn't easily test any of the workarounds posed here on your actual site, but hopefully one works for you: Problem with JQuery cycle on IE8

Upvotes: 0

Related Questions