关于bootstrap模态框 modal.js 单击模态框按钮效果出来之后为什么要阻止滚动条?


http://v3.bootcss.com/javascript/#modals
单位要求 单击模态框的时候滚动条不能消失。因为滚动条消失的时候,内容页面会变宽。
我画了个

看到我画的红圈了没,内容的滚动条没有了!
弹出模态框效果的时候。 我希望模态框效果情况下 滚动条必须存在。
请问是怎么做?

图片描述

第二个是腾讯的。人家弹出模态框效果的时候,滚动条还在!
我真郁闷 不知道怎么下手?
我希望能跟腾讯一样

我自己解决答案是
我是给这个模态框的样式 设置成overflow:inherit 。然后在bootstrap.js文件里找到padding-left 去掉就好了

jquery css bootstrap JavaScript

抽风的飞机 9 years, 8 months ago

自己写个插件就可以了

我不是高达 answered 9 years, 8 months ago

也许你可以试试这个 bootstrap3-dialog .
这个是基于 bootstrap 的一个模态框插件。比原生的更强大。主要是原生就像1L说的一样算是一个popover的效果。使用这个插件可以不依赖与dom。

爱德君7788 answered 9 years, 8 months ago

模态框弹出事件中,会给 body 添加一个 class:


 .modal-open {
  overflow: hidden;
}

自己把它重定义一下就行 overflow: auto !important; ,或者模态框弹出的时候写js


 $('#identifier').on('show.bs.modal', function () {
  // 执行一些动作...
})

但是模态框自己也会有一个滚动条(看模态框的内容高度),得禁用了,设置一个最大高度,然后给模态框的内容加一个滚动条

shuai answered 9 years, 8 months ago

严格讲下面的这个不是modalbox,只是个popover.正经的modal box ui交互定义就是要拦截其它所有交互

两边都看不见啦 answered 9 years, 8 months ago

Your Answer