Bootstrap Modal后台后台

我有一个Bootstrap模块小部件出现在模态的灰色后台后面，阻止我用模式本身做任何事情，当我点击模态本身时它仍然消失。Bootstrap Modal后台后台

我检查了我在这里找到的其他建议的解决方案，以及其他站点，包括将它移到任何父容器的外部，以便它在开始的body标记之后，就在关闭body标记之前，我甚至尝试过一种不符合标准的方法是将它放在闭合头标签和开启体标签之间，并且所有这些方法都导致了相同的问题。结果是，无论我在哪里定位模态，我都会遇到同样出现在灰色后台后面的模态本身的问题。

我的HTML模式是...

<!-- Admin Login Modal --> 
    <div id="admin-login-modal" class="modal fade bs-example-modal-lg" tabindex="-1" role="dialog" aria-hidden="true"> 
     <div class="modal-dialog modal-lg"> 
      <div class="modal-content"> 
       <div class="modal-header"> 
        <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span></button> 
        <h4 class="modal-title" id="myModalLabel">Modal title</h4> 
       </div> 
       <div class="modal-body"> 
        <h4>Text in a modal</h4> 
        <p>Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor.</p> 
        <p>Aenean lacinia bibendum nulla sed consectetur. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla.</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> 
     </div> 
    </div> 
    <!-- End Login Modal -->

就目前而言我把它定位在开口体标记之后。

任何援助与此表示赞赏。

来源

2016-02-01 Chris Rutherfurd

在关闭主体标记之前放置模态HTML – Shehary

仍然没有把标记放在关闭主体标记之前。 –

你可能想看看这个：http://stackoverflow.com/questions/10636667/bootstrap-modal-appearing-under-background?rq=1 – Dimitry

我已成功地解决这一问题，内bootstrap.min.css样式定位类。模态对话框并添加z-index：1050 ;.

来源

2016-02-01 21:53:33

删除您的代码并粘贴那么这段代码检查..我认为它会正常工作

<!-- Button trigger modal --> 
<button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModal"> 
    Launch demo modal 
</button> 

<!-- Modal --> 
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
    <div class="modal-dialog" role="document"> 
    <div class="modal-content"> 
     <div class="modal-header"> 
     <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button> 
     <h4 class="modal-title" id="myModalLabel">Modal title</h4> 
     </div> 
     <div class="modal-body"> 
     ... 
     </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> 
    </div> 
</div>`

来源

2016-02-01 12:31:41

这并没有奏效穆罕默德。 –

你能给我发送你的网页的网址吗？你在线工作还是在本地主机上工作？ –

我正在使用本地主机，所以无法发送页面的URL，我已经解决了这个问题，请参阅上述解答的答案。 –

Bootstrap Modal后台后台

回答

相关问题