Drop shadows on divs using CSS/Javascript?

[Cybertronic]

As the title says, is there such a thing that works on background colours that aren't white?

Please let me know

 

[Shoseki]

How about a semi-transparent div?

If you specify each div with a shadow div, spec the shadow div to have a slightly lower z-index, make it black and set the transparency to say, 25%, it will put a shadow over whatever is "beneath" it.

Another alternative might be to use a PNG with transparency change, though PNG doesn't work IE<7

 

[Cybertronic]

Shoseki, is there a tutorial for your reply? Thanks

 

[WotDa]

Shoseki, is there a tutorial for your reply? Thanks

Try this.

If not, hit up Google with "Semi transparent div"

 

[Shoseki]

No tutorial really... just when you specify your div (assuming you are using fixed/relative positions and not float) you simply offset it an extra x/y (so if it has left 50, top 50, it become left : 55 if your offset is 5.

Make the transparency 50%, background black and hey presto

 

[Cybertronic]

Thanks for the help, Shoseki

After searching around, I decided to have a try yDSF - Robust CSS Drop Shadows and it works great with non-white background colours

 

[psyr33n]

make it black and set the transparency to say, 25%

Doesn't work in IE(<6) either. There's an opacity filter, but it's a horrible hack.