可选择Email和用户名登录的代码
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
- <title>登陆界面</title>
- <style type="text/css">
- * {
- margin:0;
- padding:0;
- font-size:12px;
- font-weight:normal;
- font-family:verdana, tahoma, helvetica, arial, sans-serif, "宋体";
- font-style:normal;
- list-style-type:none;
- text-decoration:none;
- }
- div#body input#fnbtn {
- width:78px;
- height:39px;
- border:none;
- cursor:pointer;
- position:absolute;
- top:40px;
- left:100px;
- background:transparent url('http://www.lanrentuku.com/down/js/images/12447121190.png') 0 -70px no-repeat;
- }
- div#mask {
- position:absolute;
- top:0;
- left:0;
- background:#fff;
- filter:alpha(opacity=60);
- -moz-opacity:0.2;
- z-index:100;
- }
- div#login {
- position:absolute;
- top:75px;
- left:100px;
- width:293px;
- z-index:200;
- }
- div#login h2 {
- height:26px;
- padding-top:3px;
- padding-left:25px;
- background:transparent url('http://www.lanrentuku.com/down/js/images/12447121190.png') -84px -70px no-repeat;
- }
- div#login h2 input {
- height:18px;
- width:18px;
- float:right;
- border:none;
- cursor:pointer;
- margin:2px 6px 0 0;
- background:transparent url('http://www.lanrentuku.com/down/js/images/12447121190.png') 0 -169px no-repeat;
- }
- div#login h2 a {
- display:block;
- float:left;
- width:83px;
- height:26px;
- line-height:26px;
- text-align:center;
- text-decoration:none;
- color:#666;
- }
- div#login h2 a.cur {
- color:#f00;
- background:transparent url('http://www.lanrentuku.com/down/js/images/12447121190.png') 0 -187px no-repeat;
- }
- div#login ul {
- padding:14px 0 18px 12px;
- background:transparent url('http://www.lanrentuku.com/down/js/images/12447121190.png') -84px bottom no-repeat;
- }
- div#login ul li {
- padding-left:60px;
- margin-top:10px;
- display:inline-block;
- }
- div#login ul li {
- display:block;
- }
- div#login ul li:after {
- content:"youdian";
- clear:both;
- display:block;
- height:0;
- visibility:hidden;
- }
- div#login ul li tt {
- float:left;
- width:60px;
- margin-left:-70px;
- text-align:right;
- line-height:22px;
- color:#444;
- }
- div#login ul li div input.cell, div#login ul li div input.cell2 {
- height:16px;
- padding:2px;
- line-height:16px;
- width:179px;
- border:1px #dcdcdc solid;
- color:#666;
- }
- div#login ul li div input.cell2 {
- width:50px;
- }
- div#login ul li div label {
- color:#666;
- cursor:pointer;
- }
- div#login ul li div img {
- margin-bottom:-7px;
- margin-left:8px;
- }
- * html div#login ul li div img {
- margin-bottom:-4px;
- }
- *+html div#login ul li div img {
- margin-bottom:-4px;
- }
- div#login ul li div input#fnlogin {
- width:59px;
- height:21px;
- cursor:pointer;
- border:none;
- margin-right:15px;
- background:transparent url('http://www.lanrentuku.com/down/js/images/12447121190.png') 0 -148px no-repeat;
- }
- div#login ul li p {
- padding-top:4px;
- color:#f00;
- }
- </style>
- </head>
- <body>
- <div id="body">
- <input id="fnbtn" type="button" title="" />
- </div><div id="mask" style="display:none;"></div>
- <div id="login" style="display:none;">
- <h2><input id="fnquit" type="button" title="退出登录" /><a href="#" class="cur" name="Email">Email登录</a><a href="#" name="用户名">用户名登录</a></h2>
- <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>
- <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>
- <div><input id="reme" name="rememberme" type="checkbox" /> <label for="reme">下次自动登录</label></div></li>
- <li><tt></tt> <div><input id="fnlogin" type="button"/><a href="http://www.lanrentuku.com/" target="_blank" onclick="return checkForgetPassword()">忘记密码?</a></div></li>
- </form></ul>
- </div>
- <script type="text/javascript">
- function g(obj) {
- return document.getElementById(obj);
- }
- var login = {
- title:null,
- show:function(){
- var sWidth,sHeight;
- sWidth = screen.width;
- sWidth = document.body.offsetWidth;
- sHeight=document.body.offsetHeight;
- if (sHeight<screen.height){sHeight=screen.height;}
- g("mask").style.width = sWidth + "px";
- g("mask").style.height = sHeight + "px";
- g("mask").style.display = "block";
- g("login").style.display = "block";
- g("login").style.right = g("body").offsetLeft + "px";
- // window.status = g("body").offsetLeft;
- },
- hide:function(){
- g("mask").style.display = "none";
- g("login").style.display = "none";
- }
- }
- g("fnbtn").onclick = function(){
- login.show();
- this.blur();
- this.style.backgroundPosition = "0 -109px";
- };
- g("fnlogin").onclick = function() {
- // The following 5 lines of code is used to get the login type & pass to the form
- // One More line of code is insert to root_index.jsp to capture the hidden value
- if (document.getElementById("logtype").innerHTML == "Email:") {
- document.getElementById('loginType').value = 'email';
- } else {
- document.getElementById('loginType').value = 'mobile';
- }
- document.LoginForm.submit();
- };
- g("fnquit").onclick = function(){login.hide();g("fnbtn").style.backgroundPosition = "0 -70px";};
- var aa = g("login").getElementsByTagName("a");
- var aTab = new Array();
- for(var i=0; i<aa.length; i++){
- if(aa[i].parentNode.nodeName == "H2"){
- aTab.push(aa[i]);
- }
- }
- for(var j=0; j<aTab.length; j++){
- aTab[j].onclick = function(){
- this.blur();
- if (this.className != "cur"){
- for(var k=0; k<aTab.length; k++){aTab[k].className = ""};
- this.className = "cur"
- g("logtype").innerHTML = this.name + ":";
- }
- }
- }
- </script>
- <script language="javascript">
- login.hide();
- </script>
- </body>
- </html>
可选择Email和用户名登录的代码的更多相关文章
- 在某网站的登录页面登录时如果选择“记住用户名”,登录成功后会跳转到一个中间层(页面代码将登录的用户名和密码存在cookie),中间页面中存在一个超链接,单击超链接可以链接到第三个页面查看信息。若选择“
Response实现登录并记录用户名和密码信息 在某网站的登录页面登录时如果选择"记住用户名",登录成功后会跳转到一个中间层(页面代码将登录的用户名和密码存在cookie),中间页 ...
- git 指定用户名密码更新代码
使用git 更新代码 如何修改git 的密码一直令人费解,百度一堆也没给出答案.下面给一种替代方案. 例如:我们正常的代码地址 http://172.16.210.112/project/test.g ...
- PHP简单登录退出代码
PHP简单登录退出代码 登录页面login.html 负责收集用户填写的登录信息. <html> <head> <title></title> < ...
- laravel 用户名登录
laravel 用户名登录 默认登录设置为用户登录 laravel 5.3+ 修改文件(app\Http\Controllers\Auth\LoginController.php)增加 public ...
- asp.net ajax 检测用户名是否可用代码
原文 asp.net ajax 检测用户名是否可用代码 .net ajax 检测用户名是否可用代码 <script type="text/网页特效" src="c ...
- asp.net ajax检查用户名是否存在代码
原文 asp.net ajax检查用户名是否存在代码 用户注册时,我们经常需要检查用户名是否存在,本文就是实现无刷新验证用户名 打开开发环境VS 2005,新建项目(或打开现有项目),新建一个Web ...
- sp_change_users_login 'Update_One', '用户名', '登录名';
每次从服务器上备份好数据库(Sql Server数据库),如果将备份数据库文件在本地恢复,总会产生用户权限的问题. 经过很多次的实验后,我发现有那么一条语句可以发挥作用,就是sp_change_use ...
- 基于CSS3动态背景登录框代码
基于CSS3动态背景登录框代码.这是一款基于jQuery+CSS3实现的带有动画效果的动态背景登陆框特效.效果图如下: 在线预览 源码下载 实现的代码. html代码: <div class ...
- Ajax (Asynchronous javascript xml) 搜索框核心代码(JQuery) Ajax判断用户名存在核心代码 附:原生js的Ajax代码 其中有json的一句话解释
前端 <script type="text/javascript"> $(function(){ $("#tid").keyup(function( ...
随机推荐
- 用python简单处理图片(1):打开\显示\保存图像
一提到数字图像处理,可能大多数人就会想到matlab,但matlab也有自身的缺点: 1.不开源,价格贵 2.软件容量大.一般3G以上,高版本甚至达5G以上. 3.只能做研究,不易转化成软件. 因此, ...
- chrome浏览器插件启动本地应用程序
chrome浏览器插件启动本地应用程序 2014-04-20 00:04:30| 分类: 浏览器插件|举报|字号 订阅 下载LOFTER我的照片书 | chrome的插件开发这里就 ...
- Android -- 创建数据库到SD卡
SQLite 系统自带的SQLite是通过SQLiteOpenHelper实现的,而SQLiteOpenHelper是将数据库存储到/data/data/包名/databasas,这样做的话在没有ro ...
- [CareerCup] 8.4 Parking Lot 停车场问题
8.4 Design a parking lot using object-oriented principles. LintCode上的原题,请参见我的另一篇博客Parking Lot 停车场问题. ...
- 20145222黄亚奇《Java程序设计》第2周学习总结
教材学习内容总结 类型: 整数:short(占2字节).int(4).long(8). 浮点数:float(4).double(8) 字符:char(2) 布尔:boolean类型表示true与fal ...
- Android UI基础之五大布局
Android UI基础之五大布局 Android的界面是有布局和组件协同完成的,布局好比是建筑里的框架,而组件则相当于建筑里的砖瓦.组件按照布局的要求依次排列,就组成了用户所看见的界面.Andro ...
- 查询一个ID出现2种结果的情况
项目中书籍分个人和机构,分属不同的表 所以有的时候ID是一样的,那么只根据ID查询书籍就会存在ID=xxx的既有个人又有机构,而通常我们可能只需要一个,多的没做区分就出问题了! 所以数据统一做查询的时 ...
- java之hashCode
package com.simope.myTest; import java.util.HashMap; import java.util.Map; public class Test20151022 ...
- WCF入门 (14)
前言 上周去面试,跪了,这一年没什么长进,还是挺惭愧的. 得到的评语是:想的太多,做的太少. 做了一份面试题,最后一题是数据库的,写个查询.要查出Score有两次及两次以上超过79的Name和他的最高 ...
- angular_$attrs
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...