Question

我已经构建了一个基本的WordPress主题，它具有主要和辅助导航。 Dev网站：http://website-test-lab.com/sites/weaver/

如果缩小屏幕直到移动菜单启动，然后单击任一菜单，它们都会显示主导航。如何更改此设置以便显示单击的菜单？这是我的jQuery：

;(function($) {

// DOM ready
$(function() {

    // Append the mobile icon nav
    $('.nav').append($('<div class="nav-mobile"></div>'));

    // Add a <span> to every .nav-item that has a <ul> inside
    $('.nav ul li').has('ul').prepend('<span class="nav-click"><i class="nav-arrow"></i></span>');

    // Click to reveal the nav
    $('.nav-mobile').click(function(){
        $('.nav-list').toggle();
    });

    // Dynamic binding to on 'click'
    $('.nav-list').on('click', '.nav-click', function(){

        // Toggle the nested nav
        $(this).siblings('.nav .sub-menu').toggle();

        // Toggle the arrow using CSS3 transforms
        $(this).children('.nav-arrow').toggleClass('nav-rotate');

    });

});

}）（jQuery的）;

提前致谢

Answer 1

我最终编辑了这篇JS：

// Click to reveal the nav
$('.nav-mobile').click(function(){
    //$('.nav-list').toggle();
    $(this).parent().children(".nav-list").toggle();
});

2x手机菜单 - 只有一个打开

1 个答案: