点击一次显示一个

时间:2016-12-14 23:54:45

标签: javascript jquery

$(".cus-nav .navbar-nav > li").click(function(){
    $(this).find(".mega-menu").slideToggle("fast");
 });

当我点击li时,mega菜单将打开并切换。当我点击另一个li时,它会打开它的超级菜单。但第一个超级菜单仍然开放。所以我想点击li一次只显示一个超级菜单。

1 个答案:

答案 0 :(得分:1)

你能不能在显示所需的菜单之前隐藏所有超级菜单?

$(".cus-nav .navbar-nav > li").click(function(){
    $(".mega-menu").hide();
    $(this).find(".mega-menu").slideToggle("fast");
});

如果您需要为关闭的那个设置动画,那么您可以在打开它时添加一个类,以便稍后再次找到它

$(document).ready(function() {
    $(".navbar-bar > li").click(function() {
        var $showMenu = $(this).find(".mega-menu");
        var openMenu = !$showMenu.hasClass("opened");

        var $closeMenu = $(".mega-menu").filter(".opened");
        $closeMenu.removeClass("opened");
        $closeMenu.slideToggle("fast");

        if(openMenu){
            $showMenu.addClass("opened");
            $showMenu.slideToggle("fast");
        };       
    });
});