zoukankan      html  css  js  c++  java
  • 实现弹出登录窗口

    <div id="layer" style="display: none; " class="loginForm">
     <s:form name="loginForm" action="login" namespace="/member" method="post" >
      <div class="loginInputStyle">  
      用户名&nbsp;<input name="username" type="text" style="180px"/>
       </div>
       <div class="loginInputStyle">
       密码&nbsp;&nbsp;<input name="password" type="password" style="180px"/>
       </div>   
       <div class="loginInputStyle">
       <input type="image" src="/DessertHouse/image/loginIcon1.png" style="margin-left: 30px"   
       onclick="document.loginForm.submit()" /> 
       </div>
    </s:form>  
    </div>
    <div id="bgLayer" style="position:absolute; display: none;"></div> 
    <style type="text/css"> #bgLayer { background: #939393 none repeat scroll 0 0; height:100%; width:100%; left:0; top:0; opacity: 0.5; z-index: 10000; } #layer { width: 400px; height: 200px; margin: -180px 0 0 -170px; left: 50%; top: 50%; position: absolute; background: #FFF; z-index: 10001; border: 1px solid #1B5BAC; padding-top:50px; } .loginInputStyle{ padding:10px; } </style>
    <script language='javascript'> function showDiv() {   var bg = document.getElementById("bgLayer");   var con = document.getElementById("layer");   var w = document.documentElement.clientWidth; //网页可见区域宽   var h = document.documentElement.clientHeight;//网页可见区域高   bg.style.display="block";   bg.style.width = w + "px";   bg.style.height = h + "px";   con.style.display="block"; } function closeDiv() {   var bg = document.getElementById("bgLayer");   var con = document.getElementById("layer");   bg.style.display = "none";   con.style.display = "none"; } </script>

    上段代码是我在写J2EE项目时使用的,只是截取了部分代码,虽然不完整,但是基本实现了弹出登录窗口的功能。

  • 相关阅读:
    【Markdown】Markdown相关问题
    【Eclipse】在Project Explore中隐藏不需要显示的文件
    【Eclipse】编译使用Makefile的C工程
    【C】编译提示 warning: incompatible implicit declaration of built-in function ‘calloc’ [enabled by default]
    【Ubuntu】命令记录
    【Vim】Vim学习
    【Ubuntu】安装配置apahce
    【MPI】执行mpiexec出错
    文件上传(java web)
    使用JavaMail发送邮件
  • 原文地址:https://www.cnblogs.com/SherryIsMe/p/3487276.html
Copyright © 2011-2022 走看看