Question 30081 in Wordpress Question posted in
The official Wordpress documentation can be found here.

Clicking menu item with submenu opens all other sub menu's on mobile – WordPress

used below jquery function to add functionality to slide toggle the submenu of the menu items which has got children for the mobile viewport.

        $('.submenu-open').click(function(e) {
        $('.menu-item-has-children li').slideToggle('slow');
    });

But, it opens all the menu items with children at the same time (on mobile viewport), But it should only open the submenu of that menu item.

here is the link

Tags:

2

Answers


  1. 0

    While this may not be the exact solution, it is more on the line of what you need.

    Vanilla JS, without JQuery:

    document.querySelectorAll('.submenu-open').addEventListener('click', function(event) {
    event.target.querySelector('.menu-item-has-children li').classList.toggle('slow');
})

    Your problem ist, that you aren’t adding the class to only the clicked element, but all of them.

    Login or Signup to reply.
  2. 0

    Within the click event listener’s callback function, you have to use jQuery’s $(this) object to first off target the very .menu-item-has-children where the click event occurred.

    Then use the method children() on that object to target the related unordered list .sub-menu:

    $('.submenu-open').click(function(e) {
        $(this).children('.sub-menu').slideToggle('slow');
    });
})
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search