Max Mega Menu entire menu invisible until hover or click
-
Hello, I created a new max mega menu and have set it to display on a sidebar. To see it on the page indicated above, hover in the sidebar below the map, down to just below the gray SEARCH OTHER CITIES. The root menu item appears on hover. I want it to appear right after the page loads. If you click on that root menu item, then it stays visible. Then the visitor can hover and choose the city (link) she wants. That’s the look I want, see attached screenshot.
The WordPress theme used is a modification of the TwentyThirteen theme. The theme has a LOT of plugins, plenty of !important CSS rules. So I suspect “residual-styling.” However the documentation I’ve found on troubleshooting problems like mine focus on troubles getting the submenu to appear, or problems in mobile view.
I’ve checked and experimented with the max mega menu settings in general and the max mega menu settings for the menu item. The max mega menu theme settings are the same as for the main (top) menu. Using the same theme as the main (top) menu makes no difference. That is, the website’s main (top) menu is also a max mega menu and the top level menu items display right away as one would expect.
I also looked at the CSS, set the item’s display to “block,” that had no effect. I found your instructions to remove residual styling in header.php, here:
https://www.megamenu.com/documentation/removing-residual-styling/
tried that but it made no difference.I also thought to add JavaScript/jQuery to simulate a click on the item as described here:
https://www.megamenu.com/documentation/javascript-api/: using Insert Headers and Footers, but it also made no difference (but I’m not confident of my skills in this area):
<script>
jQuery(function($) {
$(‘a.open-a-panel’).on(‘click’, function(e) {
e.preventDefault();
var panelToShow = $(“#mega-menu-item-4458 > a.mega-menu-link”);
//$(‘#mega-menu-top-navigation’).data(‘maxmegamenu’).showPanel(panelToShow);
$(‘#mega-menu-max_mega_menu_1’).data(‘maxmegamenu’).showPanel(panelToShow);
});
});
</script>So at this point I’m out of ideas. Got any suggestions?
For what it’s worth, first I tried putting this menu into a Navigation Menu widget and it appeared, fully open, as a bullet list. Then I remembered the client wanted a drop down menu, rightly using the drop down menu style already established at the website using the Max Mega Menu. I’m pleased to find all the good documentation accompanying Max Mega Menu.
The page I need help with: [log in to see the link]
- The topic ‘Max Mega Menu entire menu invisible until hover or click’ is closed to new replies.