Jquery To Toggle Sub-menu But Keep Sub-menu Open If Sub-menu Page Active

Just trying to dive into jquery and forgive me if this has already been answered. Searched but couldn't find an example relevant to what I'm trying to do. I have a vertical menu wi

Solution 1:

I think you have two options.

1. Consider using Ajax to load your pages
2. Simulate the click event on each page.

For example:

For "Portfolio" items add this

<scripttype="text/javascript">
  $(document).ready(function(){
      jQuery('#menu-item-38>a').trigger('click');
  });
</script>

For "About Us":

<scripttype="text/javascript">
  $(document).ready(function(){
      jQuery('#menu-item-180>a').trigger('click');
  });
</script>

Solution 2:

What about removing this line

menu_ul.filter(':visible').slideUp('normal');

It would prevent to hide the inactive menus.

Give it a try and let us know.

Solution 3:

Create an extra class in your stylesheet

.menuul.keepthisopen {display:block !important;}

Add the class to the ul in the submenu that you want to keep open.

(example) On the "About" page, go to into the code, find the menu, find the "About" link which is a

item, and below that is the submenu for that. Change it to

<ul class="keepthisopen">

Works fine here, with the same code/scripts as you are using. The submenu will slide up again too if you click another menu item.

I'm working with plain code though (small site) so it's easy for me to manually change this for each page.