- This topic has 1 reply, 2 voices, and was last updated 13 years, 7 months ago by
.
-
Posts
-
I’m using the Multi-Level-Navigation-Plugin for a horizontal menu. The design is the tier-1 menu is horizontal, tier-2 submenus are also horizontal and directly below the tier 1 menu, and tier-3/4/etc are vertical below the tier-2 submenu. This is all working fine and there are no problems.
What I want to do is have the tier-2 menu for the current page to be displayed by default, and the other tier-2 submenus show up as normal when you hover over the parent in the tier-1 menu. I have tried some CSS, but nothing I try has worked.
I am using the current_page_item class to target the child ul’s, set them to display, and target the tier-3 submenus as child ul ul. But when I do this, the tier-3 menus are either all displayed or all hidden, permanently. If the inline style had the !important, I would not have to target them to hide them, since the inline style should override the inherited style from the tier-2 menu. I hope that all makes sense.
e.g.
ul#suckerfishnav li.current_page_item ul { display: block !important; visibility: visible !important; }
ul#suckerfishnav li.current_page_item ul ul { display: none !important; visibility: hidden !important; }One possible solution is to add "!important" to the inline styles added to the submenus, "display: none; visibility: hidden;", which happens dynamically and is removed when you hover over the parent. But I can not find where this is added. What sets the inline style attribute on the submenus? How can I change it to include the !important setting?
You can see the menus at demo.webguru-webdesigns.com. This is a demo site and has tons of plugins for testing and has other bugs unrelated to this plugin, so ignore those if you visit the site and find them. The menu design is not complete yet either, but I’m not worried about that at this point. I need to make sure I can provide the desired functionality before I do any more with the design.
Hi,
Sorry for the ridiculously long wait time before I have replied.The dropdown CSS created via our menu generator (and provided with our WP plugins) do not use display:none or visibility: hidden to hide the dropdowns from view. They instead use absolute position to shunt the blocks off the page. So you simply need to target the dropdowns UL tag and use left: 0 or left: auto to display it by default.
- You must be logged in to reply to this topic.