小编Lar*_*ars的帖子

Bootstrap模式堆叠删除浏览器滚动条

所以我有一点引导模态堆栈,遵循这个例子:http: //miles-by-motorcycle.com/fv-b-8-670/stacking-bootstrap-dialogs-using-event-callbacks

现在,虽然示例按预期工作,但第一个模态可能有可能扩展需要滚动的页面高度.

然而,如果是这种情况,并且较小的模态在顶部堆叠,则滚动条被移除,并且即使在较小的模态被解除时也不会出现.

http://jsfiddle.net/8N3T8/1/

<button name="openModalOne">Open 1</button>
<div id="modalone" class="modal" role="dialog" >
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h3>Modal 1</h3>
            </div>
            <div class="modal-body" style="height: 2000px">
                <button name="stackone">Stack me</button>
            </div>
            <div class="modal-footer">
                <button name="closeone">Button 1</button>
            </div>
        </div>
    </div>
</div>
<div id="modaltwo" class="modal" role="dialog" >
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h3>Modal 1</h3>
            </div>
            <div class="modal-body">
                This is a stacked modal            
            </div>
            <div class="modal-footer">
                <button name="closetwo">Close</button>
            </div>
        </div>
    </div>
</div>

$(document).ready(function(){
   $('.modal').on('hidden.bs.modal', function( event ) {
        $(this).removeClass('fv-modal-stack'); …
Run Code Online (Sandbox Code Playgroud)

jquery modal-dialog viewport twitter-bootstrap twitter-bootstrap-3

3
推荐指数
1
解决办法
3286
查看次数