登陸彈窗代碼

         自己閒暇無事在逛淘寶中,當沒有登陸的時候去結算購物車時,會彈窗讓你登陸,而不是讓你去登陸界面登陸,這樣就提高了很大的友好性,也提高了登陸速度。我特此在網上搜了個登陸彈窗代碼,界面功能還需要自己完善,拿來和大家分享一下。

代碼:

<body>

 <head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>彈出登錄框的實現代碼</title>
</head>
<body>
<style type="text/css">
body {
 margin: 0px;padding:0
}
#div1 {
 display: none;
 position: absolute;
 z-index: 1000;
 height: 100%;
 width: 100%;
 background: #000000;
 filter:Alpha(opacity=30);
}
#div2 {
 display: none;
 position: absolute;
 height: 100%;
 width: 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>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章