modal点击时 body变窄的解决办法

问题描述
3.x的body在改版为了有更好的UX效果 当modal-body 内容超长的时候 滚动鼠标即可直接滚动 不同于2.x的效果,须在modal-body上滚动鼠标,但是在做某些页面的时候body 的内容不超过100vh 就会出现强制滚动条,而这样的效果在某些时候回引起一些不必要的小麻烦 也就是页面重绘。
?
查看bs的源码后发现其在body中增加了一个class modal-open 和通过js 写入的padding-right 17px
从这里下手即可解决
?
解决办法1 简单暴力
修改js 源码
打开js源码 搜素 modal 后 再搜索 padding 就会发现一个
c.prototype.setScrollbar = function() {
var a = parseInt(this.$body.css("padding-right") || 0, 10);
this.originalBodyPad = document.body.style.paddingRight || "", this.bodyIsOverflowing && this.$body.css("padding-right", a + this.scrollbarWidth)
}
注释掉这段js 即可完成;
[b]解决办法2 修改css[/b]
祭出css 大宝剑!important

增加如下css
.modal-open {
overflow: initial !important;
}
.body{
adding-right: 0px !important;
}

?

?

0 个评论

要回复文章请先登录注册