如何制作类似gmail的模态弹出窗口(当我们尝试上传exe时生成的弹出窗口覆盖页面的滚动条)
最佳答案
GMail 在 iframe
上运行,覆盖层 div
不在此 iframe 内,因此它位于 iframe 的顶部,因此位于滚动条的顶部。
来自 GMail 的代码
html, body {
height:100%;
margin:0;
overflow:hidden; /* no scrollbars (only in the iframe) */
width:100%;
}
.cO { /* this is the iframe */
height:100%;
width:100%;
}
.Kj-JD {
background-color:#C3D9FF;
border:1px solid #4E5766;
color:#000000;
outline:0 none;
padding:5px;
position:absolute;
top:0;
width:450px;
z-index:501; /* div stays on top */
}
.Kj-JD-Jh { /* the shadow */
background-color:#808080;
left:0;
position:absolute;
top:0;
z-index:500;
}
示例 HTML
<body>
<iframe class="cO">...</iframe> <!-- the scroll works on the iframe, not the body -->
<div class="Kj-JD"></div> <!-- outside the iframe -->
<div class="Kj-JD-Jh" style="opacity: 0.5; width: 1440px; height: 361px;"></div> <!-- black background -->
</body>
要在顶部显示一个 div,我推荐 jqModal ,它会为您完成所有艰苦的工作。
关于javascript - 模态弹出像谷歌,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3069250/