Quick css menu help

Spock · Aug 11, 2009

Hi

Can you tell me what css is required so when a subcategory in a vertical dropdown menu is selected it pushes the other menu down so it can be see at all times? I have it working now but when the sub cat is activated it covers the other menu options.

I couldn't find a menu to suit my requirements (first sub drops down then further subs slide out to right) hence the hacking.

Thanks

cmcp · Aug 11, 2009

To achieve the dropdown part of the menu I think you are talking about a list within a list. Your css for the main menu will be ul {css} and the second menu will be ul ul{css}...

If it's motion you are after I think that may require a little bit of jquery / js, and if you wish the relative submenu to be shown when on the active page I think you may also need a bit of js (but I'm not strong with lists someone else will be able to guide you in that).

You may want to look into using <h2> or the :active class for displaying your active links.

fisicx · Aug 11, 2009

Avoid dropdown menus if possible. Because it's not obvious that there is a drop down until you hover you are making the visitor have to think, and that's not good. And if you then need another level to display the information that's doubly difficult. I keep falling off dropdowns so now tend to avoid sites that use them.

May I suggest that if you need 2-3 levels and a dropdown your navigation has gone sadly awry and you might need to rethink your site structure.

Spock · Aug 11, 2009

I have to disagree with you on this on, the client has many pages so an expandable menu system is the best way to get where you want fast.

It's also not a site selling things, more an information site about the consultancy services they offer, which is quite complex.

fisicx · Aug 11, 2009

I racall a test where they had a site with dropdowns and another with standard links to sub menus. The sub-menu option easily outperfomed the dropdowns in speed of use, usability, accessibility and stickyness (conversions).

However, if you do want use dropdowns (and there are always alternative even on complex sites) try the megadropdown: http://www.useit.com/alertbox/mega-dropdown-menus.html

PS, read the whole article as there are some shortcomings you need to overcome.

Search

Search

Quick css menu help

Spock

cmcp

fisicx

Spock

fisicx

Similar threads

Latest Articles