jQuery and WordPress links not working

0 Views

Got a problem with my WordPress menu. After I insert the jquery my links (in the menu and in sidebars won’t work. What to do? Thank you!

My code:

Read More

HTML 

<ul class="menu">
  <li class="menu-item">
   <a href="#">Link text</a>
     <ul class="sub-menu">
       <li><a>Text</a></li>
       <li><a>Text</a></li>
       <li><a>Text</a></li>
     </ul>
  </li>
</ul>

jQuery 

$(document).ready(function(){ 
  $('li.menu-item').each(function() {
    var $dropdown = $(this);
    $($dropdown).click(".menu-item a", function(e) {
      e.preventDefault();
      $ul = $("ul.sub-menu", $dropdown);
      $('ul.sub-menu').toggle();
      $("ul.sub-menu").not($ul).hide();
      return false;
    });

});

  $('html').click(function(){
    $("ul.sub-menu").hide();
  });

});
Post Views: 0

Related posts

Leave a Reply

2 comments

  1. There might be a problem with the event propagation. If a link within a sub-menu is clicked the click event propagates to the surrounding menu-item and triggers your JS code.

    Please try to add this code to prevent the propagation effect:

    $( "ul.sub-menu a" ).click(function( event ) {
  event.stopPropagation();
});