Start a new discussion

To start a new discussion please visit the discussions section of the GitHub home page of the project.

Discussions on GitHub

You can also search our old self-hosted forums for any useful information below but please note that posting new content here is not possible any more.

Reply To: Two menus, focus on top disables the second.

Home Forums Latest release 1.1.x Two menus, focus on top disables the second. Reply To: Two menus, focus on top disables the second.

#3746
admin
Keymaster

You could use something like this to hide/show your second menu when a sub menu of your first menu is activated:

var $mainMenu2 = $('#main-menu2');
$('#main-menu').on({
  'show.smapi': function(e, menu) {
    $mainMenu2.css('visibility', 'hidden');
  },
  'hideAll.smapi': function(e, menu) {
    $mainMenu2.css('visibility', '');
  }
});

But I’d suggest a more elegant solution – i.e. to just alter the first menu’s z-index so that its sub menus simply appear on top of the second menu:

$('#main-menu').on({
  'show.smapi': function(e, menu) {
    $(this).css('z-index', 10000);
  },
  'hideAll.smapi': function(e, menu) {
    $(this).css('z-index', '');
  }
});