本文由 DTcms素材网 – DT素材网 发布，转载请注明出处，如有问题请联系我们！漂亮网站后台登录模板+jquey背景图片满屏100%显示jquery.ez-bg-resize.js
收藏 
<!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>漂亮网站后台登录模板+jquey背景图片满屏100%显示</title> <link rel="stylesheet" href="files/css.css"> <style> body,button,form,input,li,p,ul{margin:0;padding:0} body,input{font:14px/1 "Microsoft YaHei","微软雅黑","Microsoft JhengHei","STHeiti,MingLiu"} dl,li,ol,ul{list-style:none} a{text-decoration:none} a:focus,a:hover{text-decoration:none} img{border:0} button,input,select,textarea{font-size:100%} .clearfix:after{visibility:hidden;display:block;font-size:0;content:" ";clear:both;height:0} .clearfix{display:inline-table} * html .clearfix{height:1%} .clearfix{display:block} a{text-decoration:none;color:#333;transition:all .2s ease-in-out 0s} a:hover{text-decoration:none;color:#3d74eb} .link{color:#0063d5;} a:hover.link{text-decoration:underline;} .fl{float:left} .fr{float:right} .clear { clear:both; display:block; overflow:hidden; visibility:hidden; width:0px; height:0px } body{background:#f2f2f2} body::-webkit-scrollbar{width:0;height:0} html{width:100%;height:100%;} body{width:100%;height:100%;text-align:center;overflow:hidden;position:relative;} .content{position:absolute;top:50%;left:50%;z-index:2; background:#fff; border: 1px solid #eee; -moz-border-radius: 15px; /* Gecko browsers */ -webkit-border-radius: 15px; /* Webkit browsers */ border-radius:15px; width:400px;height:300px;margin-left:-200px;margin-top:-150px; } .divm{margin:10px;height:45px;} .logintop{color:#ccc;voerflow:hidden;height:45px;line-height:45px;text-align:center;font-size:18pt;font-family:"微软雅黑"; } .inputtext{display:block;width:90%;margin:auto; height:35px; line-height:35px; font-size:15pt; border-radius:5px;/*设置圆角样式*/ border:1px solid #ccc; padding-left:8px; color:#3c3939; background:#fff;; } #loginerror{text-align:center;color:#ff0000} .but{ -moz-border-radius: 5px; /* Gecko browsers */ -webkit-border-radius: 5px; /* Webkit browsers */ border-radius:5px; font-size:15pt;font-family:"微软雅黑"; width:90%;margin:auto;height:45px;border:0px;background:#ccc;color:#3c3939;text-align:center;line-height:45px;cursor:pointer;display:block;} .but:hover{background:#eee;} </style> </head> <body> <div class="content"> <div class="logintop">Login Systems</div> <form name="Login" action="" method="post" target="_parent" id="login_form" onSubmit="return login()"> <div class="divm" style="margin-top:30px;"><input placeholder="count" type="text" name="title" id="logintitle" maxlength="40" class="inputtext"/></div> <div class="divm"><input id="loginpwd" placeholder="password" type="password" maxlength="40" name="password" id="" class="inputtext"/></div> <div class="divm" style="height:20px;line-height:20px;font-size:12px;" id="loginerror"></div> <div class="divm"><input type="button" value="登 录" onclick="javascript:login()" class="but"/></div> </form> <div> <script type="text/javascript" src="files/jquery-1.7.min.js"></script> <script type="text/javascript" src="files/jquery.ez-bg-resize.js"></script> <script> $(document).ready(function() { $("body").ezBgResize({ img : "files/loginbg.jpg", // Relative path example. You could also use an absolute url (http://...). opacity : 1, // Opacity. 1 = 100%. This is optional. center : true // Boolean (true or false). This is optional. Default is true. }); }); $(window).resize(function(){ imgsize(); }); function ajax_post(the_url,the_param,succ_callback){ jQuery.ajax({ type : 'POST', timeout : 20000, //超时时间设置，单位毫秒 cache : false, url : the_url, data : the_param, success : succ_callback, error : function(html){ }, complete : function(XMLHttpRequest,status){ //请求完成后最终执行参数 if(status=='timeout'){//超时 alert("请求超时，请刷新页面重试"); document.location.reload(); } } }); } function login(){ var ob=$("#ob"); $("#loginerror").html("登录中..."); var title=$("#logintitle").attr("value"); var pwd=$("#loginpwd").attr("value"); var message=""; var check=true; if(title==""||pwd==""){ message="用户名和密码不能为空"; check=false; } if(check){ if(ob.value!="稍等..."){ ob.value="稍等..."; ajax_post("",$('#login_form').serializeArray(),function(html){ ob.value="登录"; if(html.indexOf("失败") > 0 ) { $("#loginerror").html(html); } else{ //alert("登录成功"); //document.location.href="http://www.ablanxue.com/" } }); } else{ alert("数据提交中..."); } } else{ $("#loginerror").html(message); } } </script> </body> </html>
