gif / png transparancy for drop shadow.

[highadvantage]

hey, I'm having trouble creating a smoothly fadeing drop shadow for an image i want to put on a web page.. If i try to save as gif i get a choppy ridance of the shadow. If i do png it looks great in photoshop and even as far as in dreamweaver, but when i view it through ie the png file will have a white border around the picture. What's the problem?

[hydrospell]

The problem is png transparency is not fully supported by IE. View it in Firefox it works perfectly. If you want to achieve this effect, the only workaround, for now, would be to save the shadow on the background that you want. (i.e., your background + shadow is part of the shadow).

Hope that helps. :D

[bigcloud]

GIF supports single color transparency and is difficult to get smooth transitions between opaque and transparent. As hydrospell mentions, often the best solution is to capture part of the background into the GIF file itself.

Although PNG is a more flexible format, in terms of alpha transparency, not all browsers interpret the spec correctly. Check out the following link to see common PNG display results.

http://entropymine.com/jason/testbed/pngtrans/

[highadvantage]

yeah i've done that before "capture the background and the drop shadow as one image" but for the first time it'd be eaiser if the transparancy would just work properly.

Here is the site:
http://www.advantagetech.biz/fish_store/index.htm

Where you see the <hr> i'd like to have a gradient filled bar from left to right that fades out, and has a drop shadow... But with the given background it would be difficult if I wanted to move the bar around i'd have to recapture the image with it's "new" background.... i'm not sure i'm making sence...

[Dami]

Here's a site (http://homepage.ntlworld.com/bobosola/index.htm) that has an IE work around script.

[highadvantage]

sweeeeeetttt! thanks for that! i'll give it a go and post my results.

[highadvantage]

I tried the above java script to fix the images but it somehow stretched my images vertically by about 10 pixels. any ideas why?