Muffin Menu widget - How to prevent dropdown menu from closing on click outside menu?

VIVEKielce · May 2018

I'm using muffin menu widget to display menu inside sidebar on the page. Some menu items have dropdown submenus which close after clicking outside menu. It's very annoying if you have multilevel structure and you have to open every submenu again after clicking somewhere on the page. I'd like to prevent submenus from closing on click outside menu. How can I do this?

I've already tried to add this: $('.sub-menu').click(function(e) {e.stopPropagation();}) to custom JS, but it doesn't seem to work.

Bryan · May 2018

HI,
sorry but we do not support custom JS modificationsa and ther is no option in the theme to change this.
thanks

VIVEKielce · May 2018

Thank you for your answer. I understand.

I managed to found solution that works for me, so I will share it here for others.

Just add this to custom JS in theme options:

jQuery(function($){

$( document ).ready(function() {

if($('li.menu-item').hasClass('current-menu-ancestor')){

$('.current-menu-ancestor').toggleClass( 'hover' );

}

});

$('body').on('click', function (e) {

if (!$('li.menu-item').is(e.target)

&& $('li.menu-item').has(e.target).length === 0

&& $('.hover').has(e.target).length === 0

) {

$('.current-menu-ancestor').toggleClass( 'hover' );

}

});

Muffin Menu widget - How to prevent dropdown menu from closing on click outside menu?

Comments

This website uses cookies