堆叠bootstrap模态windwos时的背景滚动条

时间:2016-08-30 15:22:48

标签: html css twitter-bootstrap

我有一个在线表格,我想通过堆叠模态窗口来做(这样才有意义)。在打开两个模态窗口然后关闭最顶层窗口时,滚动条从模态窗口下方的内容返回。

这是一个例子:

http://www.bootply.com/FGNRPwSRgH

关闭第二个窗口时,只需查看屏幕右侧。

我能做些什么吗?我是Bootstrap的新手,我希望能够通过CSS和bootstrap来解决这个问题,但javascript并不是不可能的。

2 个答案:

答案 0 :(得分:2)

当你打开你的第一个模态时,iframe的body标签会得到一个" modal-open"这是禁用滚动,当你打开第二个模态时,它仍然存在。关闭第二个模态时,"模态打开"正在删除类,这就是滚动回来的原因。这可能是由于您将这些模态嵌套的方式。它只是想从正文中删除该类,而不知道你还有一个打开。您很可能需要使用javascript添加某种检查步骤,以确定在关闭每个模式时是否仍然具有显示属性为block的模态,如果是这样,请确保仍然在主体上设置模态打开类。我会在你可以听的那些模态结束时寻找一个回调函数。

答案 1 :(得分:0)

http://www.bootply.com/8K2wKO0c7I

$('body').append(
  $('<script />',{src:'//rawgit.com/sbreiler/bootstrap-multi-modals/master/bootstrap-multi-modals.js'})
);

如果它适合您,请从我的github获取* .js文件的副本:https://github.com/sbreiler/bootstrap-multi-modals