sub-menu

Custom menu with additional logic for display

This will add new classes to your menus triggered by click event. tell the default that you wish to not hover to have css of li:hover {display:none;} jQuery(document).ready(function($){ $(‘.nav-menu .menu-item-has-children’).on(“click”, function(e){ e.stopPropagation(); if($(this).is(“li”)){ if($(this).hasClass(‘opened’)){ $(this).addClass(‘closed’); }else{$(this).removeClass(‘closed’);} $(this).siblings().children(‘.sub-menu’).removeClass(‘visible’); $(this).siblings().removeClass(‘current-menu-parent opened’); $(this).toggleClass(‘current-menu-parent opened’); $(this).children(‘.sub-menu’).toggleClass(‘visible’); } else{ if($(this).parent().hasClass(‘opened’)){ $(this).parent().addClass(‘closed’); }else{$(this).parent().removeClass(‘closed’);} $(this).parent().siblings().children(‘.sub-menu’).removeClass(‘visible’); $(this).parent().siblings().removeClass(‘current-menu-parent’); $(this).parent().children(‘.sub-menu’).toggleClass(‘visible’); $(this).parent().toggleClass(‘current-menu-parent opened’); } });

Set one or more menus as a submenus of another menu

Link after WordPress