Page 1 of 1

[SOLVED] Menu Manager menu display

Posted: Tue Sep 27, 2011 6:35 pm
by RyanC
Hi, it's been a while since I've worked on my CMSMS site, but I'm having an issue with my menu.

I have three levels, but I want the third level to be hidden until the second level is activated.

Thanks very much for any help.

Re: Menu Manager displaying levels I want hidden until hover

Posted: Wed Sep 28, 2011 5:33 pm
by RyanC
Update:

I've figured out that this part of the template shows all the levels:

{menu template="cssmenu.tpl" number_of_levels=4}

and this seems to be the relevant css:

/* The magic - set to work for up to a 3 level menu, but can be increased unlimited, for fourth level add
#primary-nav li:hover ul ul ul,
#primary-nav li.menuparenth ul ul ul,
*/
#primary-nav ul,
#primary-nav li:hover ul,
#primary-nav li:hover ul ul,
#primary-nav li.menuparenth ul,
#primary-nav li.menuparenth ul ul {
display: none;
}
/* for fourth level add
#primary-nav ul ul ul li:hover ul,
#primary-nav ul ul ul li.menuparenth ul,
*/
#primary-nav li:hover ul,
#primary-nav ul li:hover ul,
#primary-nav ul ul li:hover ul,
#primary-nav li.menuparenth ul,
#primary-nav ul li.menuparenth ul,
#primary-nav ul ul li.menuparenth ul {
display: block;
}

But I'm not sure how these two work together. When I add the commented code to the code beneath it, nothing happens in my html document.

What I need solved is how can my menu have all the levels available but only show the levels when hovered over? I may have deleted something from the style sheet when I repurposed the styles, but I don't know what. I've searched the forums all day, reading the documentation, I can't find anything.

ideas anyone? I would appreciate it.

Re: Menu Manager displaying levels I want hidden until hover

Posted: Fri Oct 07, 2011 8:30 pm
by Dr.CSS
Your CSS should look like this, note the , after each call but not at the end...

#primary-nav ul,
#primary-nav li:hover ul,
#primary-nav li:hover ul ul,
#primary-nav li.menuparenth ul,
#primary-nav li.menuparenth ul ul,
#primary-nav li:hover ul ul ul,
#primary-nav li.menuparenth ul ul ul
{
display: none;
}

#primary-nav li:hover ul,
#primary-nav ul li:hover ul,
#primary-nav ul ul li:hover ul,
#primary-nav li.menuparenth ul,
#primary-nav ul li.menuparenth ul,
#primary-nav ul ul li.menuparenth ul,
#primary-nav ul ul ul li:hover ul,
#primary-nav ul ul ul li.menuparenth ul
{
display: block;
}

Re: Menu Manager displaying levels I want hidden until hover

Posted: Fri Oct 07, 2011 8:59 pm
by RyanC
Oh thanks, I had this solved in another thread but I forgot to notate it here!

Thanks for the code. :)