解决Bootstrap模态框导致页面改变尺寸的问题

在使用Bootstrap模态框时，如果页面有滚动条，就会导致页面向左缩小，右侧出现和滚动条宽度相近的空白。

感觉页面发生了抖动。

这是因为显示模态框时，Bootstrap会隐藏浏览器滚动条，增加页面整体宽度。而关闭模态框后，会显示浏览器滚动条，页面宽度又恢复原有尺寸。

根据网上查到的资料，解决办法如下。

删除Bootstrap的JS文件（bootstrap.js或bootstrap.min.js）中以下代码：

this._checkScrollbar(), this._setScrollbar(), $t(document.body).addClass(le),
$t(document.body).removeClass(le), t._resetAdjustments(), t._resetScrollbar()

也有可能是下方代码：

this.checkScrollbar(), this.setScrollbar(), this.$body.addClass('modal-open')
that.$body.removeClass('modal-open'), that.resetAdjustments(), that.resetScrollbar()

转载请注明：魔力Python » 解决Bootstrap模态框导致页面改变尺寸的问题