Bootstrap Modal Behind Backstage

Question

У меня проблема с модальным виджетами Bootstrap, появляющимся за серым кулисом модальности, не позволяющим мне ничего делать с самим модалом, и когда я нажимаю даже поверх самого модального, он все еще исчезает.

Я проверил другие предлагаемые решения, которые я нашел здесь, а также другие сайты, в том числе перемещая его за пределы любого родительского контейнера, чтобы он сразу после тега тега открытия непосредственно перед закрывающим тегом тела, я даже попробовал один нестандартный метод, помещая его между тегом закрывающей головки и тегом открытия тела, и все эти методы привели к той же проблеме. Результатом является то, что независимо от того, где я размещаю модальность, я получаю ту же проблему, когда сам модальный появляется за серым кулисом.

Мой модальный 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 --> 

В настоящий момент он у меня установлен сразу после тега открытия корпуса.

Любая помощь с этим оценивается.

Answer 1

мне удалось решить эту проблему, в пределах bootstrap.min.css стилей найдите класс. модальный диалог и добавить z-index: 1050 ;.

Answer 2

удалить Ваш код и вставьте этот код затем проверить .. я думаю, что это будет работать нормально

<!-- 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>`