zoukankan      html  css  js  c++  java
  • JS+CSS点击弹出登陆框代码

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>弹出登录框的实现代码</title>
    </head>
    <body>
    <style type="text/css">
    body {
    margin: 0px;padding:0
    }
    #div1 {
    display: none;
    position: absolute;
    z-index: 1000;
    height: 100%;
    100%;
    background: #000000;
    filter:Alpha(opacity=30);
    }
    #div2 {
    display: none;
    position: absolute;
    height: 100%;
    100%;
    padding-top: 10%;
    z-index: 1001;
    left: 0px;
    top: 0px;
    }
    </style>
    <script>
    function openme(){
    document.getElementById('div1').style.display='block';
    document.getElementById('div2').style.display='block';
    }
    function closeme(){
    document.getElementById('div1').style.display='none';
    document.getElementById('div2').style.display='none';
    }
    function logo_in(){alert()
    //验证
    //转向...
    //myform.action=""
    //myform.submit()
    closeme();
    }
    </script>
    <div id="div1"></div>
    <div id="div2">
    <table width="30%" border="0" cellpadding="3" cellspacing="1" style="background: #ff7300; position:static;filter:progid:DXImageTransform.Microsoft.DropShadow(color=#666666,offX=4,offY=4,positives=true)" align="center">
    <tr id="m_tr">
    <td><font color="#FFFFFF">欢迎登陆:</font></td>
    <td align="right">
    <input type="button" value="x" onClick="closeme()" style="cursor: hand;">
    </td>
    </tr>
    <tr>
    <form name="myform" method="post" >
    <td colspan="2" width="100%" bgcolor="#FFFFFF" height="150">
    username: <input type="text" name="username" size="10">
    <br>pasword:<input type="password" name="pasword" size="12">
    <br><input type="button" name="logoin" value="登陆" onClick="logo_in()">
    <input type="button" name="exit" value="取消" onClick="closeme()">
    </td>
    </form>
    </tr>
    </table>
    </div>
    <div>
    <input name="button" type="button" onClick="openme()" value="登陆" />
    </div>
    <br>
    <div>
    简单的代码
    </div>
    </body>
    </html><br /><center>如不能显示效果,请按Ctrl+F5刷新本页,更多网页代码:<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>

  • 相关阅读:
    [树状数组]JZOJ 4658 小Z调顺序
    [差分数组]JZOJ 3187 的士
    [BFS]JZOJ 4671 World Tour
    [BFS]JZOJ 4672 Graph Coloring
    [数学]JZOJ 4673 LCS again
    shell:正则表达式和文本处理器
    开发脚本自动部署及监控
    Linux中的重启命令
    nginx和nfs
    网络相关配置
  • 原文地址:https://www.cnblogs.com/shenjun/p/3195070.html
Copyright © 2011-2022 走看看