Bootstrap 禁用滚动条

Bootstrap中禁用滚动条的方法

逻辑：

当点击弹窗按钮后，js会为body元素添加一个modal-open的类，该类主要内容如下

.modal-open .modal {
  overflow-x: hidden;
  overflow-y: auto;
}

说明：modal-open使用在body上，modal是弹出框最外层DIV上的样式

该类起到禁用滚动条的作用，同时为了保证界面不会因为滚动条的消失而发生变化(默认的滚动条17个像素，滚动条消失时，width:100%的元素会把这17个像素沾满，造成排版的变化)，body元素的style中加入的padding-right:17px;

原理：

body中所有元素超出屏幕的部分隐藏 overflow: hidden; 上面的代码分别起到了禁用x轴和y轴滚动条的作用,同时用17px空白占据滚动条的位置

 

转载于:https://www.cnblogs.com/caoruiy/p/4596471.html