CSS dropdown navigation with shadow

[arbel]

Hello,

Anyone know how to achieve this (attached image) in css or maybe with a free javascript navigation?

I've created the basics with css.

[IMG]file:///C:/DOCUME%7E1/IDANAR%7E1/LOCALS%7E1/Temp/moz-screenshot.jpg[/IMG]http://www.arbel-designs.com/css_test/

One main thing that's very important to me, is to be able to achieve the drop shadow effect on the navigation.

Thanks

Idan

[Dan Schulz]

Apply the background image to the nested list container (nested UL element), then set the position to bottom left and have it repeat on an X axis. Also set the background color to white (I'm presuming that's white at the top). From there, you can declare a background color for the nested links' hover state.

[arbel]

Hello,

thanks for the reply and the help.

will this part: Apply the background image to the nested list container (nested UL element)

be for the drop shadow part? How do I get the transparency right? png isn't really an option because of ie....

Idan

[arbel]

Ok, i've been doing more research but I can't find a good drop shadow solution for the menu other than using pngs. The problem with png is that ie doesn't support them.

Any one know of a solution? should I use a javascript menu?


Thanks

idan

[Dan Schulz]

IE 6 doesn't support it natively. However, you can use a .htc file to trigger an IE only filter that will turn PNG alpha-transparency on.

[arbel]

how does this work? what is an htc file?

[Dan Schulz]

http://www.twinhelix.com/css/iepngfix/

[arbel]

thanks, i'll try to implement the drop down and post here my results.