Docs

[nepatriot]

Hello,

I was wondering if it was possible to change the default behavior of my main menu so that a user has to click on the menu item to get the submenu to open? The menu would then stay open until the user clicked on a menu item or elsewhere on the page, or the main menu item itself. I think I just want to replace the on hover main menu/submenu trigger behavior to an on click trigger.

I am running the latest version of X and Cornerstone.

Thank you.

[Rahul]

Hi,

Thanks for writing in!

You can use following under Custom > JavaScript in the Customizer:

jQuery(document).ready(function($) {
  var nav = $('.desktop .x-nav'),
      target = $('.x-navbar .desktop li.menu-item-has-children');

  nav.off('focusin focusout mouseenter mouseleave');

  target.on('click touchstart', function() {
    $(this)
      .siblings(target)
        .removeClass('x-active')
      .end()
        .toggleClass('x-active');
  });
});

This code is a basic idea that will enable the click event instead of hover. If you need more in depth changes e.g., hide the dropdown when click outside the menu, you may wish to consult with a developer. X is quite extensible with child themes, so there are plenty of possibilities.

Thanks!

[Author]

Posts