bootstrap左侧菜单如何固定,解决左侧滚动条滚动的时候页面的滚动条也滚动的问题 电脑版发表于:2019/10/11 17:20 很简单直接一句样式搞定!page-sidebar-fixed 加入到Body中即可,也可以使用Jquery动态添加,这样就可以在某些页面中去使用了。 不同页面使用不同的左侧菜单风格。 ``` $(function () { //让左侧菜单固定 $("body").addClass("page-sidebar-fixed"); //让左侧菜单默认出现的样式隐藏。时间延迟一点才能消失,不然消失不了的,可能是dom元素没有生成的原因 setTimeout(function () { $(".slimScrollBar").hide(); }, 100); }); ``` ####左侧滚动的时候右边如果有滚动条也会跟着滚动 解决方法,可以考虑判断鼠标如果在左边菜单的范围内就禁用掉右边的滚动,或者使用焦点事件,比如焦点进入,焦点失去事件。 如下方法可以解决: ``` //鼠标在左边菜单的时候,禁用body的滚动条,防止滚动左边的时候右边也一起滚动 $('.page-sidebar-menu').mousemove(function () { document.body.style.overflow = 'hidden'; }).mouseleave(function () { document.body.style.overflow = 'auto'; }); ```