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. Volly框架的使用基础版及使用中的一些坑 Ace 网络篇(三)

    直接把注释粘过来: * Volley使用讲解: * 要实现网络数据请求主要要记住下面三步骤: * 1.创建RequestQueue对象 * 2.创建XXRequest对象(XX代表String,JSO ...

  2. jquery-lazyload延迟加载图片 及 加载顺序 bug 修复

    jquery-lazyload延迟加载图片   代码修改片段 function update() { var counter = 0; /**fix by weiyj start***/ elemen ...

  3. 修改TrustedInstaller权限文件（无法删除文件）

    1.    右击需要修改的文件-属性 2.    切换到"安全"选项卡,点击"高级"按钮. 3.    切换到"所有者"选项卡 一般情况下默 ...

  4. Tomcat简易安装指南

    由于要学习activiti的使用,而activiti依赖于tomcat,所以下载了一个tomcat 7 的binary包,然后按照running.TXT中的描述来手动安装,下文主要是记录了在阅读run ...

  5. 【MPI学习3】MPI并行程序设计模式：不同通信模式MPI并行程序的设计

    学习了MPI四种通信模式 及其函数用法: (1)标准通信模式:MPI_SEND (2)缓存通信模式:MPI_BSEND (3)同步通信模式:MPI_SSEND (4)就绪通信模式:MPI_RSEND ...

  6. PHP 系列：PHP Web 开发基础

    PHP是动态类型的Web开发的脚本语言,PHP以页面文件作为加载和运行的单元,PHP现在有了Composer作为开发包管理. 1.使用Composer管理依赖 自从.NET开发用了Nuget管理程序集 ...

  7. JavaScript基础---语言基础（1）

    写在前面: 通过四篇博客把JS基础中的基础整理一下,方便自己查阅,这些内容对于实际项目开发中也许并不会在意,但是作为JS的语言基础,自觉还是应该熟悉.在完成这三篇博客(JavaScript基础---语 ...

  8. 第二章：javascript： 数组

    数组是编程世界里最常见的数据结构.任何一种编程语言都包含数组,只是形式稍微有差异.数组是编程语言中的内建类型,通常效率都很高.可以满足不同需求的数据存储,本章将探索javascript中的数组工作原理 ...

  9. 将Image转化为BufferImage

    public class BufferedImageBuilder { private static final int DEFAULT_IMAGE_TYPE = BufferedImage.TYPE ...

  10. Symfony学习--目录和入口

    1 目录结构 根目录下有: app src vendor web app是存放应用的一些配置文件,如果有一些配置文件或者文档,应当存放在这里面. src是存放你的项目的php代码,这里的php至少必须 ...