UNPKG

lixin-web

Version:

vue and bootstrap

188 lines (177 loc) 9.96 kB
<!DOCTYPE html> <html lang="zh-CN" > <head> <meta charset="utf-8"/> <meta content="width=device-width, initial-scale=1.0, user-scalable=no" name="viewport"> <title>用户注册</title> <!-- 引用样式文件开始 --> <link rel="stylesheet" type="text/css" href="/css/common-all-plugin.css"> <link rel="stylesheet" type="text/css" href="/css/common.css"> <link rel="stylesheet" type="text/css" href="/css/regist.css"> <!-- 引用样式文件结束 --> <!-- 引用脚本文件开始--> <script type="text/javascript" src="/config.js"></script> <!-- 引用脚本文件结束--> </head> <body> <div class="menu01"> <nav class="navbar" id='main-nav' > <div class="nav-min"> <div class='row' id="liixnnav"> <!-- Brand and toggle get grouped for better mobile display --> <div class="liixn-logo"> <a class="" href="index.html"><img src="img/lixinnew/logo1.png" alt="" /></a> </div> <!-- Collect the nav links, forms, and other content for toggling --> <div class="liixn_nav">如果你已拥有利信账户,则可在此<a style="color:red;font-weight:800" href="login.html">登录!</a> <a href="javascript:void(0)" data-command="kefu"><span class="glyphicon glyphicon-headphones"></span>在线客服</a> </div><!-- /.navbar-collapse --> <div class="mobliem"></div> </div><!-- /.container-fluid --> </div> </nav> <script type="text/javascript"> $('.menu01').next() $('.lxnav li a').each(function() { if ($(this)[0].pathname === window.location.pathname) { $(this).parent().addClass('active'); } }); $(".mobliem").click(function(){ $('.liixn_nav').stop().slideToggle(); $('.mobliem').toggleClass('activetm'); $('.liixn_nav li a').click(function(){ $('.liixn_nav').hide(); $('.mobliem').removeClass('activetm') }) }); /* $(window).resize(function(){ location.reload() }); */ </script> </div> <!-- 中间部分开始 --> <div class="page-content"> <div class="fill"> <div class="reference"></div> </div> <div class="page-container"> <div class="sign-up-form"> <div class="regise-logo"><img style="visibility: hidden;" class="logo" src="img/regist/logo.png"></div> <canvas id="particle"></canvas> <h1><strong>利信娱乐</strong> - 利之根本,信乃源泉</h1> <div class="logo-text">You are registering a new account</div> </div> <div class="wrapper"> <div class="regist"> <div class="y-qing"> <span class="id-user" id="id-user">利信娱乐</span>邀请您!联系QQ:<span id="qq"></span> </div> <div class="line"></div> <div class="form"> <table class="form-control"> <tbody> <tr> <td class="value"> <span class="icon-user glyphicon glyphicon-user"></span> <input name="username" placeholder="请输入用户名" type="text" class="form-control"> <div class="help-inline">例如:lixin666</div> </td> </tr> <tr> <td class="value"> <span class="glyphicon glyphicon-tags"></span> <input name="nickname" placeholder="昵称" type="text" class="form-control"> <div class="help-inline">例如:利信888</div> </td> </tr> <tr> <td class="value"> <span class="glyphicon glyphicon-lock"></span> <input name="password1" placeholder="设置密码" type="password" class="form-control"> <div class="help-inline">数字、字母</div> </td> </tr> <tr> <td class="value"> <span class="glyphicon glyphicon-lock"></span> <input name="password2" placeholder="确认密码" type="password" class="form-control"> <div class="help-inline">手动输入,粘贴无效。</div> </td> </tr> <tr> <td class="value"> <span class="glyphicon glyphicon-envelope"></span> <input name="email" placeholder="邮箱" type="text" class="form-control"> <div class="help-inline">请输入您的邮箱</div> </td> </tr> <!-- <tr data-field="registCode"> <td class="label">注册码:</td> <td class="value"> <input name="registCode" type="text" class="form-control"> <div class="help-inline"></div> </td> </tr> --> <tr> <td class="value"> <span class="glyphicon glyphicon-ok-sign"></span> <input name="securityCode" placeholder="验证码" type="text" class="form-control"> <span class="refreshi glyphicon glyphicon-repeat"></span> <div class="help-inline"></div> <div class="img"> <img height="43" width="144" src="/api/utils/regist-security-code" /> </div> </td> </tr> </tbody> </table> <div class="button-groups"> <input name="regist" class="button" value="立刻注册" type="button"/><br> </div> </div> </div> </div> </div> </div> <!-- 中间部分结束 --> <script >include('/common-all-plugin-01.js');</script> <script >include('/common-all-plugin-02.js');</script><script >include('/common-all-plugin-03.js');</script> <script >include('/app.js');</script> <script >include('/common-all.js');</script> <script >include('/game-regist.js');</script> <script type="text/javascript"> var teamName = App.getUrl('teamName'); var qq = App.getUrl('qq'); $('#id-user').html(decodeURI(decodeURI(teamName))); $('#qq').html(decodeURI(decodeURI(qq))); if(typeof(teamName) == "undefined"){ $('#id-user').html("利信娱乐") } if(typeof(qq) == "undefined"){ $('#qq').html("无") } </script> <img src="" alt="" id="rainyDay" width="100%" height="100%" /> </body> </html> <script type="text/javascript" src="/plugins/official/rainyday.min.js"></script> <script type="text/javascript"> + function() { var image = document.getElementById('rainyDay'); image.onload = function() { engine = new RainyDay({ image: this, enableSizeChange:false }); engine.rain([ [3, 2, 2] ], 100); }; image.crossOrigin = 'anonymous'; image.src = 'img/regist/signup_bg.jpg'; }() </script> <script> function animate(a){if("function"==typeof a){var b=16;ctx.clearRect(0,0,canvas.width,canvas.height),a(b),RAF(function(){animate(a)})}}function Particle(a,b,c,d,e,f,g){this.x=a,this.y=b,this.ex=c,this.ey=d,this.vx=e,this.vy=f,this.a=1500,this.color=g,this.width=particleSize_x,this.height=particleSize_y,this.stop=!1,this["static"]=!1,this.maxCheckTimes=10,this.checkLength=5,this.checkTimes=0}function useImage(){img.complete?canvasHandle.init():img.onload=function(){canvasHandle.init()}}var canvas=document.getElementById("particle"),ctx=canvas.getContext("2d");img=document.querySelector(".logo"),canvas.width=150,canvas.height=150;var mouseX=null,mouseY=null,mouseRadius=50,RAF=function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.oRequestAnimationFrame||window.msRequestAnimationFrame||function(a){window.setTimeout(a,1e3/60)}}();Array.prototype.forEach2=function(a){for(var b=0;b<this.length;b++)a.call("object"==typeof this[b]?this[b]:window,b,this[b])};var particleArray=[],animateArray=[],particleSize_x=1,particleSize_y=2,canvasHandle={init:function(){img.style.visibility="hidden",this._reset(),this._initImageData(),this._execAnimate()},_reset:function(){particleArray.length=0,animateArray.length=0,this.ite=100,this.start=0,this.end=this.start+this.ite},_initImageData:function(){this.imgx=(canvas.width-img.width)/2,this.imgy=(canvas.height-img.height)/2,ctx.clearRect(0,0,canvas.width,canvas.height),ctx.drawImage(img,this.imgx,this.imgy,img.width,img.height);for(var a=ctx.getImageData(this.imgx,this.imgy,img.width,img.height),b=0;b<img.width;b+=particleSize_x)for(var c=0;c<img.height;c+=particleSize_y){var d=4*(c*a.width+b);if(a.data[d+3]>=125){var i,e="rgba("+a.data[d]+","+a.data[d+1]+","+a.data[d+2]+","+a.data[d+3]+")",f=b+20*Math.random(),g=200*-Math.random()+400,h=img.height/2-40*Math.random()+20;i=h<this.imgy+img.height/2?300*Math.random():300*-Math.random(),particleArray.push(new Particle(f+this.imgx,h+this.imgy,b+this.imgx,c+this.imgy,g,i,e)),particleArray[particleArray.length-1].drawSelf()}}},_execAnimate:function(){var a=this;particleArray.sort(function(a,b){return a.ex-b.ex}),this.isInit||(this.isInit=!0,animate(function(b){animateArray.length<particleArray.length&&(a.end>particleArray.length-1&&(a.end=particleArray.length-1),1400==a.end&&setTimeout(function(){img.style.visibility="visible",canvas.style.display="none"},1e3),animateArray=animateArray.concat(particleArray.slice(a.start,a.end)),a.start+=a.ite,a.end+=a.ite),animateArray.forEach2(function(a){this.update(b)})}))}},tickTime=16,oldColor="";Particle.prototype={constructor:Particle,drawSelf:function(){oldColor!=this.color&&(ctx.fillStyle=this.color,oldColor=this.color),ctx.fillRect(this.x-this.width/2,this.y-this.height/2,this.width,this.height)},move:function(a){if(this.stop)this.x=this.ex,this.y=this.ey;else{a/=1e3;var b=this.ex-this.x,c=this.ey-this.y,d=Math.atan(c/b),e=Math.abs(this.a*Math.cos(d));e=this.x>this.ex?-e:e;var f=Math.abs(this.a*Math.sin(d));f=this.y>this.ey?-f:f,this.vx+=e*a,this.vy+=f*a,this.vx*=.95,this.vy*=.95,this.x+=this.vx*a,this.y+=this.vy*a,Math.abs(this.x-this.ex)<=this.checkLength&&Math.abs(this.y-this.ey)<=this.checkLength?(this.checkTimes++,this.checkTimes>=this.maxCheckTimes&&(this.stop=!0)):this.checkTimes=0}},update:function(a){this.move(a),this.drawSelf()}},useImage(); </script>