Question

我的PHP页面中有Modal的问题。

这是我的网页代码(DEMO)，但在我的网页中，我看到了背景图，其中包含图像IMAGE中的模态。

我在我的网页中包含nprogress工具，但我试图将其删除，但我遇到了同样的问题。

我将模态函数调用到我的PHP中的IF中，如下所示：

<?php
if($verificaMail=='n'){
?>
        <script>
            $(document).ready(function(){
            $('#myModal').modal()
        });
    </script>
<?php           
}
?>

我将模态代码放在页面底部，在</body>标记之前，如下所示：

<div id="myModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
  <div class="modal-header">
    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">x</button>
    <h4 class="modal-title">Modal title</h4>
  </div>
  <div class="modal-body">
    <p>One fine body</p>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    <button type="button" class="btn btn-primary">Save changes</button>
  </div>
</div>

Answer 1

我使用此代码解决了：

#myModal .modal-dialog{
    z-index: 1041 !important;
}

但是如果我想当用户在模态外部点击时它就不会关闭？我该怎么办？

Answer 2

将此添加到您的css。

#myModal {
  z-index: 16777271 !important;
}

或打开后致电$("#myModal").css("z-index", "1500");。

z-index给出了div的优先级，优先级越多，优先级越高。

bootstrap模态背景封面模态

2 个答案: