I'm using a few things from bootstrap in my template, like glyphicon's and a navbar. Which is on my "forum.php". Now when I want to delete a topic, I want a javascript popup to show up which is working just fine. But through that popup I can see bootstraps navbar and glyphicon. How do I fix this?
forum.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;
}
popup.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";
}
When popup is showing, through that div, on the background I see the glypicon of bootstrap without being faded into the background. It shows without opacity. The rest of the page is faded with the opacity defined in the css.
将弹出窗口的z-index
更改为1。
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.