请教一下登录界面的弹出是怎么制作的？
如题，点击页面上的登录按钮，弹出登录窗口，此时后面的页面不能再操作，这个是怎么实现的，求详解。。
--------------------编程问答--------------------
B/S结构一般是用层来实现的
--------------------编程问答--------------------
#addDiv {position: absolute;
top: 300px;
left: 550px;
border: 5px solid #ff9224;
display: none;
width: 470px;
height: 300px;
background: #e3f0f9;
color: black;
z-index: 2;
text-align: center;
overflow: auto;
}
.black_overlay {
display: none;
position: absolute;
top: 0%;
left: 0%;
width: 100%;
height: 100%;
background-color: #EEEEEE;
z-index: 1;
-moz-opacity: 0.8;
opacity: .80;
filter: alpha(opacity = 80);
}
function showLogin() {
var addDiv = document.getElementById("addDiv");
addDiv.style.display = "block";
document.getElementById("fade").style.display = "block";
}
function hideLogin() {
var addDiv = document.getElementById("addDiv");
addDiv.style.display = 'none';
document.getElementById("fade").style.display = "none";
}
<div id="addDiv">这里写登陆的。。。</div>
<div id="fade" class="black_overlay">
希望对你有帮助！！ --------------------编程问答-------------------- 使用模式对话框 --------------------编程问答-------------------- 这个用模态窗口在实现，给一段代码楼主参考：
var url = encodeURI('fawensearchRoles.action?parameters='+ parameters);
var obj = new Object();
obj = window.showModalDialog(url,window,"dialogWidth=500px;dialogHeight=400px");
encodeURI 是用来转码防止出现中文乱码的。
fawensearchRoles.action 也可以写成 login.jsp.. --------------------编程问答--------------------
能具体讲一下怎么实现的吗？ --------------------编程问答-------------------- 里面写登陆的html的标签啊‘
用户名：<input....>
密码：<input...>
提交啊
登陆按钮处设置onclick事件调用showLogin() 这个方法
逻辑不复杂哈 --------------------编程问答-------------------- 鄙人以前写过，我给你说一下大概思路，你Jquery吗?不会就算了，那么办法。
jquery中有个diog 这个方法你自己百度一下啊..... --------------------编程问答-------------------- 用框架的话可以用jqueryui的dialog或者colorbox也不错啊
如果不用框架，自己写的话。。给你贴个简单的
--------------------编程问答--------------------
<div id="backDiv" style="display:none;filter:alpha(opacity=50);opacity:0.5;-moz-opacity:0.5;position:fixed;_position:absolute;top:0;left:0;width:100%;height:100%;background:#fff;z-index:1;">
<iframe style="position:absolute;filter:alpha(opacity=0);opacity:0;-moz-opacity:0;left:0;top:0;width:100%;height:99%;"></iframe>
</div>
<div id="loginDiv" style="display:none;width:830px;height:470px;">
<h1>登录</h1>
<input type="button" value="close" onclick="close()" />
</div>
<script type="text/javascript">
var backDiv = document.getElementById("backDiv");
var loginDiv = document.getElementById("loginDiv");
window.onload = function() {
// 弹出登录页面
var wHeight = document.body.offsetHeight;
var wWidth = document.body.offsetWidth;
var top = (wHeight - parseInt(loginDiv.style.height, 10)) / 2;
var left = (wWidth - parseInt(loginDiv.style.width, 10)) / 2;
backDiv.style.display = "block";
backDiv.style.height = wHeight;
backDiv.style.width = wWidth;
backDiv.style.position = "absolute";
loginDiv.style.display = "block";
loginDiv.style.border = "#ccc 8px solid";
loginDiv.style.position = "absolute";
loginDiv.style.top = top + "px";
loginDiv.style.left = left + "px";
}
function close() {
backDiv.style.display = "none";
loginDiv.style.display = "none";
}
</script>
ms 漏了个style
<style type="text/css">
#loginDiv { overflow:hidden; z-index:2; }
</style> --------------------编程问答-------------------- 谢谢大家的热心帮忙哈，已经基本搞定，但还是不知道怎么把弹出页面的空白设成阴影，像很多网站那样。。。 --------------------编程问答-------------------- 如果你是动态JSP页面的话，那还好，就是用一个href把那个登录做个连接，连接到登录界面就行了啊！或者用<form action="(登录界面)">就好啦！
补充：Java , Web 开发
