Loading different images depending on the browser (JavaScript)

[Nevsan]

I have an interesting problem... The way my page is designed, I use a lot of transparent images, so I use the .PNG format (Mostly to get dropshadows). Thing is, IE for Windows, doesn't seem to support the transparency so my sit ends up looking horrible. What I was wondering, is if it is possible to use a JavaScript or something to detect what browser is being used, and then load a different .GIF image (Without dropshadows)... I could just scrap the dropshadows in general but I would like to keep them for people with browsers that do support .PNG transparency...

Also, since my layout is completely CSS based (not a single table), I was wondering if I could to the same for background images, since a few browsers support .PNG transparency for background images too... (The url's of the background images are stored in the style sheet so I don't think JavaScript can help here, but it's worth asking.)

If you want to see what I mean when I say it renders horribly in Windows IE, take a look at this:

http://homepage.mac.com/nevsan/

It renders fine in Mac browsers though. I think Opera for Windows might render it correctly, so try that out to see what it's supposed to look like. Here's a screenshot of what it's supposed to look like.


P.S. While I'm here, any way to get rid of that 2 pixel spacing between div elements that ieWin seems to throw in there?

 

[OneEyedDog]

Not so inline with PNG transparency but a technique I was looking at two days ago is here:

http://www.alistapart.com/articles/cssdropshadows/

Hope this helps in anyway,

Warm Wishes,

 

[Anthony]

I would recommend going with .gifs for transparency, since it doesn't look like IE will be supporting .png transparency anytime soon.

 

[Nevsan]

So I guess I'm SOL here? Damn. Those drop-shadows looked good too . Frickin' IE. I hate it. Funny how all hacks seem to target IE since it screws everything up, and yet it just happens to be the most popular browser. God I hate MS....

Oh, one more thought. Do you think it would be reasonable to, maybe, set up a PHP script or something so it loads different stylesheets/html pages depending on the browser or platform? I actually know nothing on PHP, but I already know C/C++ so it shouldn't be too hard.... Wait, would a webhost such as, say, .Mac, even let me use PHP?