先说下思想JSP弹出登岸框的思想，我们在JSP中新建一个div层，然后Display配置成none，这样打开后是不行见的，然后我们通过一个点击事件，好比当我们点击登岸按钮时，就给它注册一个点击事件，使得div层变得可见，这样就实现了弹出结果。
代码如下：
CSS样式：
<style> .win { POSITION:absolute; left:55%; top:60%; width:400px; height:250px; margin-left:-300px;margin-top:-200px; border:1px solid #888; background-color: #d6cfcb; text-align: center; line-height: 60px; z-Index:3; } </style>
JS代码：
<script> function openLogin(){ document.getElementById("win").style.display=""; } function closeLogin(){ document.getElementById("win").style.display="none"; } </script>
html代码：
<div> <form action="javascript:jump();" method="post"> <span> 接待登岸网上书店 </span> <br /> <label> 用户名: </label> <input type="text" /> <br /> <label> 暗码: </label> <input type="password" /> <br /> <input type="reset" value="重输" /> <input type="button" value="退出" /> <input type="submit" value="确定" /> </form> </div> <a href="javascript:openLogin();" >打开</a> <a href="javascript:closeLogin();" >封锁</a>
运行的结果：
点击打开按钮：
点击封锁就消失了。
再说下在点击之后造成的阴影结果，即除了登录框外的城市变暗，而且不行操纵。焦点思想就是我们在配置一个div层，而且将其初始配置为埋没，当点击好比登岸时，和登岸框一起弹出，而且配置这个div的宽度和高度别离为屏幕的高度和宽度，颜色上也是选择暗一点的带有透明度的颜色（这个是在上面登录框的基本长举办操纵的）
代码如下：
CSS样式：
<style> .hidebg { position:absolute; left:0px; top:0px; background-color:#000; width:100%; filter:alpha(opacity=60); opacity:0.6; display:none; z-Index:2; } </style>
JS代码：
function openLogin(){ document.getElementById("hidebg").style.display="block"; document.getElementById("hidebg").style.height=document.body.clientHeight+"px"; } function closeLogin(){ document.getElementById("hidebg").style.display="none"; }
html代码：
<div></div>
运行的结果：
点击打开：
点击封锁就可以封锁了。
上面的两部门代码可以和写在一起组成弹出登录框以及周围阴影的结果。