gpt4 book ai didi

javascript - 单击屏幕或其他按钮时关闭菜单

转载 作者:行者123 更新时间:2023-11-30 20:10:55 26 4
gpt4 key购买 nike

我有两个垂直菜单和两个按钮。每个菜单只有在您单击其按钮时才会打开和关闭。

但我希望通过单击“showLeft”按钮隐藏“showRight”菜单。

如果我点击监视器上的任何地方,两个菜单都会关闭

<button id="showLeft">Show/Hide Left Slide Menu</button>
<button id="showRight">Show/Hide Right Slide Menu</button>

<script>
var menuLeft = document.getElementById( 'cbp-spmenu-s1' ),
menuRight = document.getElementById( 'cbp-spmenu-s2' ),
body = document.body;

showLeft.onclick = function() {
classie.toggle( this, 'active' );
classie.toggle( menuLeft, 'cbp-spmenu-open' );
disableOther( 'showLeft' );

};
showRight.onclick = function() {
classie.toggle( this, 'active' );
classie.toggle( menuRight, 'cbp-spmenu-open' );
disableOther( 'showRight' );
};


function disableOther( button ) {
if( button !== 'showLeft' ) {
classie.toggle( showLeft, 'disabled' );
}
if( button !== 'showRight' ) {
classie.toggle( showRight, 'disabled' );
}
}

var topNavBar = 50;
var footer = 48;
var height = $(window).height();
$('.cbp-spmenu').css('height', (height - (topNavBar+footer)));

$(window).resize(function(){
var height = $(window).height();
$('.cbp-spmenu').css('height', (height - (topNavBar+footer)));
});


</script>

最佳答案

Working fiddle .

当你点赞时,你需要删除其他菜单的类 cbp-spmenu-open :

showLeft.onclick = function() {
classie.toggle(this, 'active');
classie.toggle(menuLeft, 'cbp-spmenu-open');
classie.remove(menuRight, 'cbp-spmenu-open');
};

showRight.onclick = function() {
classie.toggle(this, 'active');
classie.toggle(menuRight, 'cbp-spmenu-open');
classie.remove(menuLeft, 'cbp-spmenu-open');
};

关于javascript - 单击屏幕或其他按钮时关闭菜单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52430598/

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com