'Tab' navigation

[josephman1988]

Hi,

So basically, I want a 'tab' like navigation where when rolled over, the menu slides out.

In pure CSS?


example attatched.

[MikeHopley]

You should make the text visible without rollover (otherwise it's incredibly annoying for users). In order to emphasise the current/rollover tab you just need to add a little CSS padding (making it longer). Perhaps change the colour too, or make the text bold.

That said, tab navigation is a misleading metaphor and should not be used to navigate between pages. Use tabs to show different views of the same thing -- stateful navigation, if you like.

A good use of tabs is on this page. Scroll down to see the main photograph box with tabs.

A bad use of tabs is for top-level site navigation (Amazon style).

[moojoo]

http://www.mevans76.com/css_layouts/css_menus/ has some examples that may help you. The tabs themselves are straight forward and adding a menu is also just a matter of a nested UL and some CSS magic

#foo ul li:hover ul li {} kind of thing.

[saltedm8]

a few here http://css.maxdesign.com.au/listamatic/