网页前端

bootstrap打开模态modal窗口引起页面抖动解决办法

作者:admin110 来源:web交流网 2018-05-29 17:54 浏览:0 我要评论(0)

在使用bootstrap的modal模态窗口组件时,触发后会发现页面有抖动现象。这是因为它隐藏了浏览器滚动条,页面就相当于变宽了,关闭模态窗口后

在使用bootstrap的modal模态窗口组件时,触发后会发现页面有抖动现象。这是因为它隐藏了浏览器滚动条,页面就相当于变宽了,关闭模态窗口后,页面又出现滚动条,页面又变窄了,这一伸一缩就会使页面产生抖动现象。我的解决方法很简单,就是干掉隐藏滚动条的代码。总共删除bootstrap.js文件中6行代码就可以了。

以bootstrap3.3.6版本中未压缩的bootstrap.js文件为例。

第一处在971行左右,删除这3句

  • this.checkScrollbar()
  • this.setScrollbar()
  • this.$body.addClass('modal-open')

第二处1081行左右,也删除3句

  • that.$body.removeClass('modal-open')
  • that.resetAdjustments()
  • that.resetScrollbar()

这样就好了。都是写无关紧要的代码,给body加内边距的,不会影响其他组件的运行。

转载请注明出处。

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源;3.作者投稿可能会经我们编辑修改或补充。

网友点评
评论(已有0条评论)
还没有评论,快来抢沙发吧!
新闻
  • 新闻
  • 软件
精彩导读