引导字形/导航栏显示弹出窗口

Bootstrap glyphicon/nav bar showing popup window

本文关键字:显示 窗口 导航 字形      更新时间:2023-09-26

我在模板中使用了一些引导程序的东西,比如glyphicon和导航栏。在我的"论坛.php上。现在,当我想删除一个主题时,我希望显示一个javascript弹出窗口,它工作正常。但是通过该弹出窗口,我可以看到引导导航栏和glyphicon。我该如何解决这个问题?

论坛.php

    <table class="overview">
       <tr class="row1">
         <td class="col1">
            <button>
               <span class="glyphicon glyphicon-eye-open">
               </span>
            </button>
        </td>
      </tr>
   </table>
        <button onclick="showDiv()">Delete category</button>

CSS.css

#popup_container {
width:100%;
height:100%;
opacity:.99;
top:0;
left:0;
display: none;
position:fixed;
background-color:#313131;
overflow:auto
}
#prompt-delete {
position:absolute;
left:50%;
top:17%;
margin-left:-202px;
}

弹出窗口.php

<div id="popup_container">
   <div id="prompt-delete">
      <h2> my popup</h2>
      <button onclick="closeDiv()">Close</button>
   </div>
</div>

Javascript.js

function showDiv() {
   document.getElementById('popup_container').style.display = "block";
}
function closeDiv() {
   document.getElementById("popup_container").style.display = "none";
}

当弹出窗口显示时,通过该div,在背景上,我看到了引导的字形,而不会淡入背景。它显示时没有不透明度。页面的其余部分会随着 CSS 中定义的不透明度而淡化。

弹出窗口的z-index更改为 1。