1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    2. 

  2. <html xmlns="http://www.w3.org/1999/xhtml">
    3. 

  3. <head>
    4. 

  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    5. 

  5. <title>登陆界面</title>
    6. 

  6. <style type="text/css">
    7. 

  7. * {
    8. 

  8. margin:0;
    9. 

  9. padding:0;
    10. 

  10. font-size:12px;
    11. 

  11. font-weight:normal;
    12. 

  12. font-family:verdana, tahoma, helvetica, arial, sans-serif, "宋体";
    13. 

  13. font-style:normal;
    14. 

  14. list-style-type:none;
    15. 

  15. text-decoration:none;
    16. 

  16. }
    17. 

  17. div#body input#fnbtn {
    18. 

  18. width:78px;
    19. 

  19. height:39px;
    20. 

  20. border:none;
    21. 

  21. cursor:pointer;
    22. 

  22. position:absolute;
    23. 

  23. top:40px;
    24. 

  24. left:100px;
    25. 

  25. background:transparent url('http://www.lanrentuku.com/down/js/images/12447121190.png') 0 -70px no-repeat;
    26. 

  26. }
    27. 

  27. div#mask {
    28. 

  28. position:absolute;
    29. 

  29. top:0;
    30. 

  30. left:0;
    31. 

  31. background:#fff;
    32. 

  32. filter:alpha(opacity=60);
    33. 

  33. -moz-opacity:0.2;
    34. 

  34. z-index:100;
    35. 

  35. }
    36. 

  36. div#login {
    37. 

  37. position:absolute;
    38. 

  38. top:75px;
    39. 

  39. left:100px;
    40. 

  40. width:293px;
    41. 

  41. z-index:200;
    42. 

  42. }
    43. 

  43. div#login h2 {
    44. 

  44. height:26px;
    45. 

  45. padding-top:3px;
    46. 

  46. padding-left:25px;
    47. 

  47. background:transparent url('http://www.lanrentuku.com/down/js/images/12447121190.png') -84px -70px no-repeat;
    48. 

  48. }
    49. 

  49. div#login h2 input {
    50. 

  50. height:18px;
    51. 

  51. width:18px;
    52. 

  52. float:right;
    53. 

  53. border:none;
    54. 

  54. cursor:pointer;
    55. 

  55. margin:2px 6px 0 0;
    56. 

  56. background:transparent url('http://www.lanrentuku.com/down/js/images/12447121190.png') 0 -169px no-repeat;
    57. 

  57. }
    58. 

  58. div#login h2 a {
    59. 

  59. display:block;
    60. 

  60. float:left;
    61. 

  61. width:83px;
    62. 

  62. height:26px;
    63. 

  63. line-height:26px;
    64. 

  64. text-align:center;
    65. 

  65. text-decoration:none;
    66. 

  66. color:#666;
    67. 

  67. }
    68. 

  68. div#login h2 a.cur {
    69. 

  69. color:#f00;
    70. 

  70. background:transparent url('http://www.lanrentuku.com/down/js/images/12447121190.png') 0 -187px no-repeat;
    71. 

  71. }
    72. 

  72. div#login ul {
    73. 

  73. padding:14px 0 18px 12px;
    74. 

  74. background:transparent url('http://www.lanrentuku.com/down/js/images/12447121190.png') -84px bottom no-repeat;
    75. 

  75. }
    76. 

  76. div#login ul li {
    77. 

  77. padding-left:60px;
    78. 

  78. margin-top:10px;
    79. 

  79. display:inline-block;
    80. 

  80. }
    81. 

  81. div#login ul li {
    82. 

  82. display:block;
    83. 

  83. }
    84. 

  84. div#login ul li:after {
    85. 

  85. content:"youdian";
    86. 

  86. clear:both;
    87. 

  87. display:block;
    88. 

  88. height:0;
    89. 

  89. visibility:hidden;
    90. 

  90. }
    91. 

  91. div#login ul li tt {
    92. 

  92. float:left;
    93. 

  93. width:60px;
    94. 

  94. margin-left:-70px;
    95. 

  95. text-align:right;
    96. 

  96. line-height:22px;
    97. 

  97. color:#444;
    98. 

  98. }
    99. 

  99. div#login ul li div input.cell, div#login ul li div input.cell2 {
    100. 

  100. height:16px;
    101. 

  101. padding:2px;
    102. 

  102. line-height:16px;
    103. 

  103. width:179px;
    104. 

  104. border:1px #dcdcdc solid;
    105. 

  105. color:#666;
    106. 

  106. }
    107. 

  107. div#login ul li div input.cell2 {
    108. 

  108. width:50px;
    109. 

  109. }
    110. 

  110. div#login ul li div label {
    111. 

  111. color:#666;
    112. 

  112. cursor:pointer;
    113. 

  113. }
    114. 

  114. div#login ul li div img {
    115. 

  115. margin-bottom:-7px;
    116. 

  116. margin-left:8px;
    117. 

  117. }
    118. 

  118. * html div#login ul li div img {
    119. 

  119. margin-bottom:-4px;
    120. 

  120. }
    121. 

  121. *+html div#login ul li div img {
    122. 

  122. margin-bottom:-4px;
    123. 

  123. }
    124. 

  124. div#login ul li div input#fnlogin {
    125. 

  125. width:59px;
    126. 

  126. height:21px;
    127. 

  127. cursor:pointer;
    128. 

  128. border:none;
    129. 

  129. margin-right:15px;
    130. 

  130. background:transparent url('http://www.lanrentuku.com/down/js/images/12447121190.png') 0 -148px no-repeat;
    131. 

  131. }
    132. 

  132. div#login ul li p {
    133. 

  133. padding-top:4px;
    134. 

  134. color:#f00;
    135. 

  135. }
    136. 

  136. </style>
    137. 

  137. </head>
    138. 

  138. <body>
    139. 

  139. <div id="body">
    140. 

  140. <input id="fnbtn" type="button" title="" />
    141. 

  141. </div><div id="mask" style="display:none;"></div>
    142. 

  142. <div id="login" style="display:none;">
    143. 

  143. <h2><input id="fnquit" type="button" title="退出登录" /><a href="#" class="cur" name="Email">Email登录</a><a href="#" name="用户名">用户名登录</a></h2>
    144. 

  144. <ul><form id="LoginForm" name="LoginForm" action="http://www.lanrentuku.com/"  method="post" enctype="multipart/form-data" ><li><input id="loginType" name="loginType" type="hidden"/><tt><label id="logtype" for="email">Email:</label></tt><div><input id="username" name="username" type="text" class="cell" onKeyPress="return checkSubmit(event)"/></div></li>
    145. 

  145. <li><tt><label for="password">密　码:</label></tt><div><input id="password" name="password" type="password" class="cell" onKeyPress="return checkSubmit(event)" /></div></li><li><tt></tt>
    146. 

  146. <div><input id="reme" name="rememberme" type="checkbox" />　<label for="reme">下次自动登录</label></div></li>
    147. 

  147. <li><tt></tt> <div><input id="fnlogin" type="button"/><a href="http://www.lanrentuku.com/" target="_blank" onclick="return checkForgetPassword()">忘记密码?</a></div></li>
    148. 

  148. </form></ul>
    149. 

  149. </div>
    150. 

  150. <script type="text/javascript">
    151. 

  151. function g(obj) {
    152. 

  152. return document.getElementById(obj);
    153. 

  153. }
    154. 

  154. var login = {
    155. 

  155. title:null,
    156. 

  156. show:function(){
    157. 

  157. var sWidth,sHeight;
    158. 

  158. sWidth = screen.width;
    159. 

  159. sWidth = document.body.offsetWidth;
    160. 

  160. sHeight=document.body.offsetHeight;
    161. 

  161. if (sHeight<screen.height){sHeight=screen.height;}
    162. 

  162. g("mask").style.width = sWidth + "px";
    163. 

  163. g("mask").style.height = sHeight + "px";
    164. 

  164. g("mask").style.display = "block";
    165. 

  165. g("login").style.display = "block";
    166. 

  166. g("login").style.right = g("body").offsetLeft + "px";
    167. 

  167. //                window.status = g("body").offsetLeft;
    168. 

  168. },
    169. 

  169. hide:function(){
    170. 

  170. g("mask").style.display = "none";
    171. 

  171. g("login").style.display = "none";
    172. 

  172. }
    173. 

  173. }
    174. 

  174. g("fnbtn").onclick = function(){
    175. 

  175. login.show();
    176. 

  176. this.blur();
    177. 

  177. this.style.backgroundPosition = "0 -109px";
    178. 

  178. };
    179. 

  179. g("fnlogin").onclick = function() {
    180. 

  180. // The following 5 lines of code is used to get the login type & pass to the form
    181. 

  181. // One More line of code is insert to root_index.jsp to capture the hidden value
    182. 

  182. if (document.getElementById("logtype").innerHTML == "Email:") {
    183. 

  183. document.getElementById('loginType').value = 'email';
    184. 

  184. } else {
    185. 

  185. document.getElementById('loginType').value = 'mobile';
    186. 

  186. }
    187. 

  187. document.LoginForm.submit();
    188. 

  188. };
    189. 

  189. g("fnquit").onclick = function(){login.hide();g("fnbtn").style.backgroundPosition = "0 -70px";};
    190. 

  190. var aa = g("login").getElementsByTagName("a");
    191. 

  191. var aTab = new Array();
    192. 

  192. for(var i=0; i<aa.length; i++){
    193. 

  193. if(aa[i].parentNode.nodeName == "H2"){
    194. 

  194. aTab.push(aa[i]);
    195. 

  195. }
    196. 

  196. }
    197. 

  197. for(var j=0; j<aTab.length; j++){
    198. 

  198. aTab[j].onclick = function(){
    199. 

  199. this.blur();
    200. 

  200. if (this.className != "cur"){
    201. 

  201. for(var k=0; k<aTab.length; k++){aTab[k].className = ""};
    202. 

  202. this.className = "cur"
    203. 

  203. g("logtype").innerHTML = this.name + ":";
    204. 

  204. }
    205. 

  205. }
    206. 

  206. }
    207. 

  207. </script>
    208. 

  208. <script language="javascript">
    209. 

  209. login.hide();
    210. 

  210. </script>
    211. 

  211. </body>
    212. 

  212. </html>

650) this.width=650;" border="0" alt="" src="http://img1.51cto.com/attachment/201203/110140921.png" />

可选择Email和用户名登录的代码的更多相关文章

  1. 在某网站的登录页面登录时如果选择“记住用户名”,登录成功后会跳转到一个中间层（页面代码将登录的用户名和密码存在cookie）,中间页面中存在一个超链接，单击超链接可以链接到第三个页面查看信息。若选择“

    Response实现登录并记录用户名和密码信息 在某网站的登录页面登录时如果选择"记住用户名",登录成功后会跳转到一个中间层(页面代码将登录的用户名和密码存在cookie),中间页 ...

  2. git 指定用户名密码更新代码

    使用git 更新代码 如何修改git 的密码一直令人费解,百度一堆也没给出答案.下面给一种替代方案. 例如:我们正常的代码地址 http://172.16.210.112/project/test.g ...

  3. PHP简单登录退出代码

    PHP简单登录退出代码 登录页面login.html 负责收集用户填写的登录信息.  <html> <head> <title></title> < ...

  4. laravel 用户名登录

    laravel 用户名登录 默认登录设置为用户登录 laravel 5.3+ 修改文件(app\Http\Controllers\Auth\LoginController.php)增加 public ...

  5. asp.net ajax 检测用户名是否可用代码

    原文  asp.net ajax 检测用户名是否可用代码 .net ajax 检测用户名是否可用代码 <script type="text/网页特效" src="c ...

  6. asp.net ajax检查用户名是否存在代码

    原文  asp.net ajax检查用户名是否存在代码 用户注册时,我们经常需要检查用户名是否存在,本文就是实现无刷新验证用户名 打开开发环境VS 2005,新建项目(或打开现有项目),新建一个Web ...

  7. sp_change_users_login 'Update_One', '用户名', '登录名';

    每次从服务器上备份好数据库(Sql Server数据库),如果将备份数据库文件在本地恢复,总会产生用户权限的问题. 经过很多次的实验后,我发现有那么一条语句可以发挥作用,就是sp_change_use ...

  8. 基于CSS3动态背景登录框代码

    基于CSS3动态背景登录框代码.这是一款基于jQuery+CSS3实现的带有动画效果的动态背景登陆框特效.效果图如下: 在线预览   源码下载 实现的代码. html代码: <div class ...

  9. Ajax (Asynchronous javascript xml) 搜索框核心代码(JQuery) Ajax判断用户名存在核心代码 附:原生js的Ajax代码 其中有json的一句话解释

    前端 <script type="text/javascript"> $(function(){ $("#tid").keyup(function( ...

随机推荐

  1. [转]World Wind学习总结一

    WW的纹理,DEM数据,及LOD模型 以earth为例 1． 地形数据: 默认浏览器纹理数据存放在/Cache/Earth/Images/NASA Landsat Imagery/NLT Landsa ...

  2. JNI 程序开发

    参考资料: http://blog.csdn.net/wwj_748/article/details/28136061 JNI_最简单的Java调用C/C++代码 http://blog.csdn.n ...

  3. php基础07：流程控制

    <?php //1.PHP foreach循环只适用于数组,并用于遍历数组中的每个键/值对. $colors = array("red","green", ...

  4. 《深入理解计算机系统》 Chapter 7 读书笔记

    <深入理解计算机系统>Chapter 7 读书笔记 链接是将各种代码和数据部分收集起来并组合成为一个单一文件的过程,这个文件可被加载(货被拷贝)到存储器并执行. 链接的时机 编译时,也就是 ...

  5. 实验一（不知道怎么上传.docx格式）

    北京电子科技学院(BESTI) 实     验    报     告 课程:深入理解计算机系统        班级:1353 姓名:魏静静 文艺 刘虹辰 学号:20135302 20135331 20 ...

  6. 【android】实现一个自己的标题栏

    完整项目下载 背景:项目中使用标题栏,只是简单的include一个标题栏的视图,赋值.控制元素显示.点击事件都要自己搞,不优雅! 要求: 1:对现有代码入侵最小 2:使用足够简单 OK,围绕着这个需求 ...

  7. sql server 使用函数辅助查询

    函数是所有语言系统下都具备的内部数据处理过程,SQL SERVER也同样内置了许多函数.在SQL SERVER中,函数是由一个或多个T-SQL语句组成的子程序.利用函数可以简化数据的处理操作. 函数分 ...

  8. 【OpenCV入门教程之一】 安装OpenCV：OpenCV 3.0 +VS 2013 开发环境配置

    图片太多,具体过程参照: [OpenCV入门教程之一] 安装OpenCV:OpenCV 3.0.OpenCV 2.4.8.OpenCV 2.4.9 +VS 开发环境配置 说下我这边的设置: 选择deb ...

  9. Web前端开发Chrome插件

    参考:http://www.cnblogs.com/sosoft/p/3490481.html 越来越多的前端开发人员喜欢在Chrome里开发调试代码,Chrome有许多优秀的插件可以帮助前端开发人员 ...

  10. UVA5870 乱搞 Smooth Visualization

    #include<stdio.h> #include<string.h> #define maxn 1201 ][],s[maxn]; int col; int getmax( ...