javascript - 单击选项卡时关闭滑动菜单

标签 javascript jquery

这是一个幻灯片菜单的jsfiddle:

http://jsfiddle.net/fh6p4/

$('#button').toggle( 
function() {
    $('#right').animate({ left: 250 }, 'slow', function() {
        $('#button').html('Close');
    });
}, 
function() {
    $('#right').animate({ left: 0 }, 'slow', function() {
        $('#button').html('Menu');
    });
}

);

我需要在单击 item1、item2 等时关闭此菜单。可以吗?

最佳答案

尝试这个简短的 jQuery 片段:-

$('#button, #menu > ul > li').click(function(){
    var $this = $('#button');
    $('#right').animate({ left: ($this.html() == 'Close' ? 0 : 250) },'slow', function(){
         $this.html($this.html() == 'Close' ? 'Menu' : 'Close');
    });
});

DEMO

或者

$('#button, #menu > ul > li').click(function(){
    var left = parseInt($('#right').css('left'));
    $('#right').animate({ left: (left == 250 ? 0 : 250) },'slow', function(){
          $('#button').html( left == 250 ? 'Menu' : 'Close');
     });
});

DEMO

关于javascript - 单击选项卡时关闭滑动菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36217901/

相关文章:

javascript - 使用 jQuery .click 关闭 slider

Jquery .attr() 所有 id 末尾的数字

javascript - 使用javascript提取xml文件的根元素属性

javascript - 文档就绪按钮。单击仅适用于控制台

javascript - webpack - 如何根据需要加载分块的 polyfill 文件

javascript - Jquery 数组通配符

javascript - 将文本添加到 pre 标记时保持滚动条向下

javascript - 在 jQuery 中包装生成的元素

javascript - 添加事件调用其他方法的方法

php - 使用 jquery.load() 发送数据