Modal上的Bootstrap叠加控件 - 滚动问题

Question

我一直致力于一个小型项目，该模型在模态上包含自举轮播控件，以便用户可以从模态导航到模态，而无需单击它。它完美无缺，除了一件事，在第一个模态之后，用户无法再向下滚动到开放模态中。

我认为这与我使用z-index将控件（.pull-front）放在身体前面有关，但是我需要控件<a>才能访问且是唯一的占据屏幕边缘的一个小区域。不确定为什么他们会覆盖实​​际内容？有任何想法吗？在此先感谢高手！

.pull-front {
  z-index:9;
  cursor: pointer;
}

我已根据具体情况制作了一个代码： http://codepen.io/simplecreatif/pen/bWQYVQ

Answer 1

这是因为当您点击.modal-open或next按钮时，bootstrap会从正文中移除prev类。如果模态打开，则必须将modal-open类添加到正文中。

所以在你的js

中添加这段代码

$('body').on('hidden.bs.modal', function () {
    if($('.modal.in').length)
    {
        $('body').addClass('modal-open');
    }
});

这是链接：http://codepen.io/anon/pen/GmwygL

Answer 2

不错，但实际上是因为当您点击btn-next时，您会在modal-open上丢失课程body。它需要该类才能正常工作。