How can I make CSS tabs with drop down menus without Javascript?

Question

I need to make tabs that also have drop down menu and requirements are that they have to work without JavaScript. Is this possible and is there good example of this somewhere?

Answer 1

Here is one Solution

Answer 2

Try Suckerfish, Javascript is needed for Internet Explorer as older versions only support :hover on links.

Answer 3

Basically you need to use the hover pseudo class on the anchor tag. To avoid using javascript you need to make sure navigation is structured so the anchors can do this as in ie6 this is the only element that allows hover. So using CSS for the off state you set the element that contains the dropdown to display: none and then on the hover you set it to display: block;

It is actually fairly straightforward - the hard bit is positioning the drop down where you want it.

Answer 4

see this http://www.lwis.net/free-css-drop-down-menu/dropdown.nvidia.com.html

it's pure css . see the source code to understand.

This is built by Free css dropdown menu framework http://www.lwis.net/free-css-drop-down-menu/

Minimal JavaScript code only for IE 6 or earlier. Everything else is pure CSS.

if u need pure css in all browser including IE 6 try this

http://www.cssplay.co.uk/menus/new-dropdown.html

but it has some limitations

Edit:

This is also pure css menu.

http://www.grc.com/menu2/invitro.htm

This includes IE5.x, IE6, IE7's betas, all old and new Netscapes, Mozillas, Firefoxes (on PC and Linux platforms), Operas, Safari and many other Mac browsers