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>

  • 相关阅读:
    开源 Serverless 里程碑:Knative 1.0 来了
    以一致的体验交付和管理云原生多集群应用
    iLogtail使用入门K8S环境日志采集到SLS
    如何在golang代码里面解析容器镜像
    mac vmware 无法复制粘贴
    使用vi编辑时上下左右方向键被转化为A、B、C、D
    left join 和 left outer join 的区别
    设计模式之 适配器模式
    设计模式之 命令模式
    设计模式学习之 策略模式
  • 原文地址:https://www.cnblogs.com/shenjun/p/3195070.html
Copyright © 2011-2022 走看看