如果单击新的,则关闭最后打开的切换

时间:2015-03-17 06:51:52

标签: javascript jquery html toggle

我想关闭最后一个打开的切换,如果点击了另一个切换,则所有三个都不相关。

这是代码:

jQuery(function($){

    // hamburger menu
    $("#nav-trigger span").click(function(){
        if ($("nav#nav-mobile ul").hasClass("expanded")) {
            $("nav#nav-mobile ul.expanded").removeClass("expanded").slideUp(250);
            $(this).removeClass("open");
        } else {
            $("nav#nav-mobile ul").addClass("expanded").slideDown(250);
            $(this).addClass("open");
        }
    });

    // slidepanel
    $('#panel-right').slidingPanel({position:'right', margin:'2.5em'});

    // footer slide up menu
    $(".btn-slide").click(function(){
        $("#panel").slideToggle("slow");
    });

})

1 个答案:

答案 0 :(得分:0)

我自己设法解决了这个问题。这是更新后的代码:

`

jQuery(function($){
// hamburger menu
$('#nav-trigger span').click(function(){

    if ($('nav#nav-mobile ul').hasClass('expanded')) {

    $('nav#nav-mobile ul.expanded').removeClass('expanded').slideUp(250);
        $(this).removeClass('open');
    } else {

    $('nav#nav-mobile ul').addClass('expanded').slideDown(250);
        $(this).addClass('open');
    }

    // close footer panel if open
    $('#panel:visible').slideToggle();

    // close tabbed side panel if open
    $( '#panel-right' ).animate({ right: 0, width: 40 }, 250, function() { }).removeClass('opened');

});

// initiate slidepanel
$('#panel-right').slidingPanel({position:'right', margin:'2.5em'});

// close other toggles if sidepanel is clicked
$('.tab').click(function() {

    // close footer if open
    $('#panel:visible').slideToggle();

    // close menu if open
    $('nav#nav-mobile ul.expanded').removeClass('expanded').slideUp(250);
    $('#nav-trigger span').removeClass('open');
});

// footer slide up menu
$('.btn-slide').click(function(){

    //show footer panel
    $('#panel').slideToggle('slow');

    //close menu if open
    $('nav#nav-mobile ul.expanded').removeClass('expanded').slideUp(250);
    $('#nav-trigger span').removeClass('open');

    //close tabbed side panel if open
    $( '#panel-right' ).animate({ right: 0, width: 40 }, 250, function() { }).removeClass('opened');

});})