devbox
Cpp五条
这个屌丝很懒，什么也没留下！
关注作者
热门标签
热门文章
当前位置:   article > 正文

5个拿来就能用的炫酷动画登录页面_html动态登陆界面

作者：Cpp五条 | 2024-06-06 13:10:32

赞

踩

html动态登陆界面

代码的打包下载地址 百度网盘

链接：https://pan.baidu.com/s/1qjquFV9j7I0KldFu7d7eZg?pwd=n2sz
提取码：n2sz

一. 炫酷星空

代码：

  1. <!DOCTYPE HTML>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5. <title>运营系统登录页</title>
  6.  
  7. <link href="static/css/login.css" rel="stylesheet" type="text/css">
  8. <script type="text/javascript" src="static/lib/jquery/1.9.1/jquery.min.js"></script> 
  9. <script src="static/js/verificationNumbers.js" tppabs="static/js/verificationNumbers.js"></script>
  10. <style>
  11. .J_codeimg{z-index:-1;position:absolute;}
  12. </style>
  13.  
  14. </head>
  15. <body>
  16. <div class="login-box" id="demo">
  17.    <div class="input-content">
  18.      <div class="login_tit">
  19.           <div>
  20.             <i class="tit-bg left"></i>
  21.               Everyday · 运营系统
  22.             <i class="tit-bg right"></i>
  23.           </div>
  24.           <p>Strive&nbsp;&nbsp;&nbsp;&nbsp;Everyday</p>
  25.      </div>    
  26.      <p class="p user_icon">
  27.        <input type="text" placeholder="账号" autocomplete="off" class="login_txtbx">
  28.      </p> 
  29.      <p class="p pwd_icon">
  30.        <input type="text" placeholder="密码" autocomplete="off" class="login_txtbx">
  31.      </p>     	
  32.      <div class="p val_icon">
  33.         <div class="checkcode">
  34.           <input type="text" id="J_codetext" placeholder="验证码" autocomplete="off" maxlength="4" class="login_txtbx">
  35.           <canvas class="J_codeimg" id="myCanvas" onclick="createCode()" onselectstart="return false">对不起，您的浏览器不支持canvas，请下载最新版浏览器!</canvas>
  36.         </div>
  37.         <a class="ver_btn" onclick="createCode();" onselectstart="return false">看不清，换一张</a>
  38.       </div>      
  39.       <div class="signup">
  40.       	  <a class="gv" href="#" onclick="validate()">登&nbsp;&nbsp;录</a>
  41.           <a class="gv" href="#">清&nbsp;&nbsp;空</a>
  42.      </div>
  43.   </div>
  44.   <div class="canvaszz"> </div>
  45.   <canvas id="canvas"></canvas> 
  46. </div>
  47. <script>
  48. //宇宙特效
  49. "use strict";
  50. var canvas = document.getElementById('canvas'),
  51.   ctx = canvas.getContext('2d'),
  52.   w = canvas.width = window.innerWidth,
  53.   h = canvas.height = window.innerHeight,
  54.  
  55.   hue = 217,
  56.   stars = [],
  57.   count = 0,
  58.   maxStars = 2500;//星星数量
  59.  
  60. var canvas2 = document.createElement('canvas'),
  61.   ctx2 = canvas2.getContext('2d');
  62. canvas2.width = 100;
  63. canvas2.height = 100;
  64. var half = canvas2.width / 2,
  65.   gradient2 = ctx2.createRadialGradient(half, half, 0, half, half, half);
  66. gradient2.addColorStop(0.025, '#CCC');
  67. gradient2.addColorStop(0.1, 'hsl(' + hue + ', 61%, 33%)');
  68. gradient2.addColorStop(0.25, 'hsl(' + hue + ', 64%, 6%)');
  69. gradient2.addColorStop(1, 'transparent');
  70.  
  71. ctx2.fillStyle = gradient2;
  72. ctx2.beginPath();
  73. ctx2.arc(half, half, half, 0, Math.PI * 2);
  74. ctx2.fill();
  75.  
  76. // End cache
  77.  
  78. function random(min, max) {
  79.   if (arguments.length < 2) {
  80.     max = min;
  81.     min = 0;
  82.   }
  83.  
  84.   if (min > max) {
  85.     var hold = max;
  86.     max = min;
  87.     min = hold;
  88.   }
  89.  
  90.   return Math.floor(Math.random() * (max - min + 1)) + min;
  91. }
  92.  
  93. function maxOrbit(x, y) {
  94.   var max = Math.max(x, y),
  95.     diameter = Math.round(Math.sqrt(max * max + max * max));
  96.   return diameter / 2;
  97.   //星星移动范围，值越大范围越小，
  98. }
  99.  
  100. var Star = function() {
  101.  
  102.   this.orbitRadius = random(maxOrbit(w, h));
  103.   this.radius = random(60, this.orbitRadius) / 18; 
  104.   //星星大小
  105.   this.orbitX = w / 2;
  106.   this.orbitY = h / 2;
  107.   this.timePassed = random(0, maxStars);
  108.   this.speed = random(this.orbitRadius) / 500000; 
  109.   //星星移动速度
  110.   this.alpha = random(2, 10) / 10;
  111.  
  112.   count++;
  113.   stars[count] = this;
  114. }
  115.  
  116. Star.prototype.draw = function() {
  117.   var x = Math.sin(this.timePassed) * this.orbitRadius + this.orbitX,
  118.     y = Math.cos(this.timePassed) * this.orbitRadius + this.orbitY,
  119.     twinkle = random(10);
  120.  
  121.   if (twinkle === 1 && this.alpha > 0) {
  122.     this.alpha -= 0.05;
  123.   } else if (twinkle === 2 && this.alpha < 1) {
  124.     this.alpha += 0.05;
  125.   }
  126.  
  127.   ctx.globalAlpha = this.alpha;
  128.   ctx.drawImage(canvas2, x - this.radius / 2, y - this.radius / 2, this.radius, this.radius);
  129.   this.timePassed += this.speed;
  130. }
  131.  
  132. for (var i = 0; i < maxStars; i++) {
  133.   new Star();
  134. }
  135.  
  136. function animation() {
  137.   ctx.globalCompositeOperation = 'source-over';
  138.   ctx.globalAlpha = 0.5; //尾巴
  139.   ctx.fillStyle = 'hsla(' + hue + ', 64%, 6%, 2)';
  140.   ctx.fillRect(0, 0, w, h)
  141.  
  142.   ctx.globalCompositeOperation = 'lighter';
  143.   for (var i = 1, l = stars.length; i < l; i++) {
  144.     stars[i].draw();
  145.   };
  146.  
  147.   window.requestAnimationFrame(animation);
  148. }
  149.  
  150. animation();
  151. </script>
  152.  
  153. </body>
  154. </html>

二.动态云层

 

代码： 

  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. 	<head>
  3. 		<meta charset="UTF-8">
  4. 		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  5. 		<meta name="viewport" content="width=device-width, initial-scale=1.0">
  6. 		<meta http-equiv="pragma" content="no-cache">
  7. 		<meta http-equiv="cache-control" content="no-cache">
  8. 		<meta http-equiv="expires" content="0">
  9. 		<title>登录界面</title>
  10. 		<link href="css/default.css" rel="stylesheet" type="text/css" />
  11. 		<!--必要样式-->
  12. 		<link href="css/styles.css" rel="stylesheet" type="text/css" />
  13. 		<link href="css/demo.css" rel="stylesheet" type="text/css" />
  14. 		<link href="css/loaders.css" rel="stylesheet" type="text/css" />
  15. 	</head>
  16.  
  17. 	<body>
  18. 		<div class='login'>
  19. 			<div class='login_title'>
  20. 				<span>管理员登录</span>
  21. 			</div>
  22. 			<div class='login_fields'>
  23. 				<div class='login_fields__user'>
  24. 					<div class='icon'>
  25. 						<img alt="" src='img/user_icon_copy.png'>
  26. 					</div>
  27. 					<input name="login" placeholder='用户名' maxlength="16" type='text' autocomplete="off" value="kbcxy" />
  28. 					<div class='validation'>
  29. 						<img alt="" src='img/tick.png'>
  30. 					</div>
  31. 				</div>
  32. 				<div class='login_fields__password'>
  33. 					<div class='icon'>
  34. 						<img alt="" src='img/lock_icon_copy.png'>
  35. 					</div>
  36. 					<input name="pwd" placeholder='密码' maxlength="16" type='text' autocomplete="off">
  37. 					<div class='validation'>
  38. 						<img alt="" src='img/tick.png'>
  39. 					</div>
  40. 				</div>
  41. 				<div class='login_fields__password'>
  42. 					<div class='icon'>
  43. 						<img alt="" src='img/key.png'>
  44. 					</div>
  45. 					<input name="code" placeholder='验证码' maxlength="4" type='text' name="ValidateNum" autocomplete="off">
  46. 					<div class='validation' style="opacity: 1; right: -5px;top: -3px;">
  47. 						<canvas class="J_codeimg" id="myCanvas" onclick="Code();">对不起，您的浏览器不支持canvas，请下载最新版浏览器!</canvas>
  48. 					</div>
  49. 				</div>
  50. 				<div class='login_fields__submit'>
  51. 					<input type='button' value='登录'>
  52. 				</div>
  53. 			</div>
  54. 			<div class='success'>
  55. 			</div>
  56. 			<div class='disclaimer'>
  57. 				<p>欢迎登陆后台管理系统</p>
  58. 			</div>
  59. 		</div>
  60. 		<div class='authent'>
  61. 			<div class="loader" style="height: 44px;width: 44px;margin-left: 28px;">
  62. 				<div class="loader-inner ball-clip-rotate-multiple">
  63. 					<div></div>
  64. 					<div></div>
  65. 					<div></div>
  66. 				</div>
  67. 			</div>
  68. 			<p>认证中...</p>
  69. 		</div>
  70. 		<div class="OverWindows"></div>
  71. 		
  72. 		<link href="layui/css/layui.css" rel="stylesheet" type="text/css" />
  73. 		
  74. 		<script type="text/javascript" src="js/jquery.min.js"></script>
  75. 		<script type="text/javascript" src="js/jquery-ui.min.js"></script>
  76. 		<script type="text/javascript" src='js/stopExecutionOnTimeout.js?t=1'></script>
  77. 		<script type="text/javascript" src="layui/layui.js"></script>
  78. 		<script type="text/javascript" src="js/Particleground.js"></script>
  79. 		<script type="text/javascript" src="Js/Treatment.js"></script>
  80. 		<script type="text/javascript" src="js/jquery.mockjax.js"></script>
  81. 		<script type="text/javascript">
  82. 			var canGetCookie = 0; //是否支持存储Cookie 0 不支持 1 支持
  83. 			var ajaxmockjax = 1; //是否启用虚拟Ajax的请求响 0 不启用  1 启用
  84. 			//默认账号密码
  85.  
  86. 			var truelogin = "kbcxy";
  87. 			var truepwd = "1";
  88.  
  89. 			var CodeVal = 0;
  90. 			Code();
  91.  
  92. 			function Code() {
  93. 				if(canGetCookie == 1) {
  94. 					createCode("AdminCode");
  95. 					var AdminCode = getCookieValue("AdminCode");
  96. 					showCheck(AdminCode);
  97. 				} else {
  98. 					showCheck(createCode(""));
  99. 				}
  100. 			}
  101.  
  102. 			function showCheck(a) {
  103. 				CodeVal = a;
  104. 				var c = document.getElementById("myCanvas");
  105. 				var ctx = c.getContext("2d");
  106. 				ctx.clearRect(0, 0, 1000, 1000);
  107. 				ctx.font = "80px 'Hiragino Sans GB'";
  108. 				ctx.fillStyle = "#E8DFE8";
  109. 				ctx.fillText(a, 0, 100);
  110. 			}
  111. 			$(document).keypress(function(e) {
  112. 				// 回车键事件  
  113. 				if(e.which == 13) {
  114. 					$('input[type="button"]').click();
  115. 				}
  116. 			});
  117. 			
  118. 			var open = 0;
  119. 			layui.use('layer', function() {
  120. 				//非空验证
  121. 				$('input[type="button"]').click(function() {
  122. 					var login = $('input[name="login"]').val();
  123. 					var pwd = $('input[name="pwd"]').val();
  124. 					var code = $('input[name="code"]').val();
  125. 					if(login == '') {
  126. 						ErroAlert('请输入您的账号');
  127. 					} else if(pwd == '') {
  128. 						ErroAlert('请输入密码');
  129. 					} else if(code == '' || code.length != 4) {
  130. 						ErroAlert('输入验证码');
  131. 					} else {
  132. 						//登陆
  133. 						var JsonData = {
  134. 							login: login,
  135. 							pwd: pwd,
  136. 							code: code
  137. 						};
  138. 						//$.post("url",JsonData,function(data) {
  139. 						console.log(111);
  140. 						alert("登录成功");
  141. 						//window.location.href = 'http://127.0.0.1:8020/jQueryLogin/index.html?__hbt=1567408106021';
  142. 						//});						
  143. 					}
  144. 				})
  145. 			})
  146. 			//全屏
  147. 			var fullscreen = function() {
  148. 				elem = document.body;
  149. 				if(elem.webkitRequestFullScreen) {
  150. 					elem.webkitRequestFullScreen();
  151. 				} else if(elem.mozRequestFullScreen) {
  152. 					elem.mozRequestFullScreen();
  153. 				} else if(elem.requestFullScreen) {
  154. 					elem.requestFullscreen();
  155. 				} else {
  156. 					//浏览器不支持全屏API或已被禁用  
  157. 				}
  158. 			}
  159. 		</script>
  160. 		<script type="text/javascript" src="img/ThreeWebGL.js"></script>
  161. 		<script type="text/javascript" src="img/ThreeExtras.js"></script>
  162. 		<script type="text/javascript" src="img/Detector.js"></script>
  163. 		<script type="text/javascript" src="img/RequestAnimationFrame.js"></script>
  164. 		<script id="vs" type="x-shader/x-vertex">
  165. 			varying vec2 vUv; void main() { vUv = uv; gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 ); }
  166. 		</script>
  167. 		<script id="fs" type="x-shader/x-fragment">
  168. 			uniform sampler2D map; uniform vec3 fogColor; uniform float fogNear; uniform float fogFar; varying vec2 vUv; void main() { float depth = gl_FragCoord.z / gl_FragCoord.w; float fogFactor = smoothstep( fogNear, fogFar, depth ); gl_FragColor = texture2D( map, vUv ); gl_FragColor.w *= pow( gl_FragCoord.z, 20.0 ); gl_FragColor = mix( gl_FragColor, vec4( fogColor, gl_FragColor.w ), fogFactor ); }
  169.  
  170. 		</script>
  171. 		<script type="text/javascript">
  172. 			if(!Detector.webgl) Detector.addGetWebGLMessage();
  173. 			var canvas = document.createElement('canvas');
  174. 			canvas.width = 32;
  175. 			canvas.height = window.innerHeight;
  176. 			var context = canvas.getContext('2d');
  177. 			var gradient = context.createLinearGradient(0, 0, 0, canvas.height);
  178. 			gradient.addColorStop(0, "#1e4877");
  179. 			gradient.addColorStop(0.5, "#4584b4");
  180. 			context.fillStyle = gradient;
  181. 			context.fillRect(0, 0, canvas.width, canvas.height);
  182. 			document.body.style.background = 'url(' + canvas.toDataURL('image/png') + ')';
  183. 			var container;
  184. 			var camera, scene, renderer, sky, mesh, geometry, material, i, h, color, colors = [],
  185. 				sprite, size, x, y, z;
  186. 			var mouseX = 0,
  187. 				mouseY = 0;
  188. 			var start_time = new Date().getTime();
  189. 			var windowHalfX = window.innerWidth / 2;
  190. 			var windowHalfY = window.innerHeight / 2;
  191. 			init();
  192. 			animate();
  193.  
  194. 			function init() {
  195. 				container = document.createElement('div');
  196. 				document.body.appendChild(container);
  197. 				camera = new THREE.Camera(30, window.innerWidth / window.innerHeight, 1, 3000);
  198. 				camera.position.z = 6000;
  199. 				scene = new THREE.Scene();
  200. 				geometry = new THREE.Geometry();
  201. 				var texture = THREE.ImageUtils.loadTexture('data:image/png;base64,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');
  202. 				texture.magFilter = THREE.LinearMipMapLinearFilter;
  203. 				texture.minFilter = THREE.LinearMipMapLinearFilter;
  204. 				var fog = new THREE.Fog(0x4584b4, -100, 3000);
  205. 				material = new THREE.MeshShaderMaterial({
  206. 					uniforms: {
  207. 						"map": {
  208. 							type: "t",
  209. 							value: 2,
  210. 							texture: texture
  211. 						},
  212. 						"fogColor": {
  213. 							type: "c",
  214. 							value: fog.color
  215. 						},
  216. 						"fogNear": {
  217. 							type: "f",
  218. 							value: fog.near
  219. 						},
  220. 						"fogFar": {
  221. 							type: "f",
  222. 							value: fog.far
  223. 						},
  224. 					},
  225. 					vertexShader: document.getElementById('vs').textContent,
  226. 					fragmentShader: document.getElementById('fs').textContent,
  227. 					depthTest: false
  228. 				});
  229. 				var plane = new THREE.Mesh(new THREE.Plane(64, 64));
  230. 				for(i = 0; i < 8000; i++) {
  231. 					plane.position.x = Math.random() * 1000 - 500;
  232. 					plane.position.y = -Math.random() * Math.random() * 200 - 15;
  233. 					plane.position.z = i;
  234. 					plane.rotation.z = Math.random() * Math.PI;
  235. 					plane.scale.x = plane.scale.y = Math.random() * Math.random() * 1.5 + 0.5;
  236. 					GeometryUtils.merge(geometry, plane)
  237. 				}
  238. 				mesh = new THREE.Mesh(geometry, material);
  239. 				scene.addObject(mesh);
  240. 				mesh = new THREE.Mesh(geometry, material);
  241. 				mesh.position.z = -8000;
  242. 				scene.addObject(mesh);
  243. 				renderer = new THREE.WebGLRenderer({
  244. 					antialias: false
  245. 				});
  246. 				renderer.setSize(window.innerWidth, window.innerHeight);
  247. 				container.appendChild(renderer.domElement);
  248. 				document.addEventListener('mousemove', onDocumentMouseMove, false);
  249. 				window.addEventListener('resize', onWindowResize, false)
  250. 			}
  251.  
  252. 			function onDocumentMouseMove(event) {
  253. 				mouseX = (event.clientX - windowHalfX) * 0.25;
  254. 				mouseY = (event.clientY - windowHalfY) * 0.15
  255. 			}
  256.  
  257. 			function onWindowResize(event) {
  258. 				camera.aspect = window.innerWidth / window.innerHeight;
  259. 				camera.updateProjectionMatrix();
  260. 				renderer.setSize(window.innerWidth, window.innerHeight)
  261. 			}
  262.  
  263. 			function animate() {
  264. 				requestAnimationFrame(animate);
  265. 				render()
  266. 			}
  267.  
  268. 			function render() {
  269. 				position = ((new Date().getTime() - start_time) * 0.03) % 8000;
  270. 				camera.position.x += (mouseX - camera.target.position.x) * 0.01;
  271. 				camera.position.y += (-mouseY - camera.target.position.y) * 0.01;
  272. 				camera.position.z = -position + 8000;
  273. 				camera.target.position.x = camera.position.x;
  274. 				camera.target.position.y = camera.position.y;
  275. 				camera.target.position.z = camera.position.z - 1000;
  276. 				renderer.render(scene, camera)
  277. 			}
  278. 		</script>
  279. 	</body>
  280.  
  281. </html>

 三.深海灯光水母

 代码：

  1. <!doctype html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>登录</title>
  6. <link rel="stylesheet" href="lib/layui/css/layui.css" media="all" />
  7. <link rel="stylesheet" href="css/login.css" />
  8. <script type="text/javascript" src="js/jquery.min.js"></script>
  9. <script type="text/javascript" src="js/jquery.pure.tooltips.js"></script>
  10. <script type="text/javascript" src="lib/layui/layui.js"></script>
  11. <style>
  12. html,body {
  13.     width: 100%;
  14.     height: 100%;
  15.     margin: 0;
  16.     padding: 0;
  17.     overflow: hidden;
  18. }
  19. .container{
  20.     width: 100％;
  21.     height: 100%;
  22.     margin: 0;
  23.     padding: 0;
  24.     background-color: #000000;
  25. }
  26.  
  27. .box { width:450px; height:295px; background:#000000; position:absolute; top:50%; left:50%; margin-left:-14%; margin-top:-10%; z-index:3;opacity: 0.6;}
  28. </style>
  29.  
  30. </head>
  31. <body>
  32.  
  33. <div id="jsi-jellyfish-container" class="container">
  34.  
  35. <div class="beg-login-box box">
  36. 	<header>
  37. 		<h1 style="color:#FFFFFF">欢迎登录</h1>
  38. 	</header>
  39. 	<div class="beg-login-main">
  40. 		<form action="" class="layui-form" method="post"><input name="__RequestVerificationToken" type="hidden" value="fkfh8D89BFqTdrE2iiSdG_L781RSRtdWOH411poVUWhxzA5MzI8es07g6KPYQh9Log-xf84pIR2RIAEkOokZL3Ee3UKmX0Jc8bW8jOdhqo81" />		
  41. 			<div class="layui-form-item">
  42. 				<label class="beg-login-icon">
  43. 				<i class="layui-icon">&#xe612;</i>
  44. 			</label>
  45. 				<input type="text" name="userName" lay-verify="userName" autocomplete="off" placeholder="请输入登录名" class="layui-input">
  46. 			</div>
  47. 			<div class="layui-form-item">
  48. 				<label class="beg-login-icon">
  49. 				<i class="layui-icon">&#xe642;</i>
  50. 			</label>
  51. 				<input id="login-password" type="password" name="password" lay-verify="password" autocomplete="off" placeholder="请输入密码" class="layui-input">
  52. 			</div>
  53. 			<div class="layui-form-item">
  54. 				<div class="beg-pull-left beg-login-remember" style="color:#FFFFFF;margin-top: 9%;">
  55. 					<label>记住帐号？</label>
  56. 					<input type="checkbox" name="rememberMe" lay-skin="switch" lay-text="ON|OFF" checked>
  57. 				</div>
  58. 				<div class="beg-pull-right">
  59. 					<button class="layui-btn layui-btn-primary" lay-submit lay-filter="login" style="margin-top: 33%;" onclick="login()">
  60. 					<i class="layui-icon">&#xe650;</i> 登录
  61. 				</button>
  62. 				</div>
  63. 				<div class="beg-clear"></div>
  64. 			</div>
  65. 		</form>
  66. 	</div>
  67. 	
  68. 	
  69. </div>
  70.  
  71. <script>
  72. var RENDERER = {
  73. 	JELLYFISH_RATE: 0.00015,
  74. 	DUST_RATE: 0.0005,
  75. 	ADJUST_DISTANCE : 100,
  76. 	ADJUST_OFFSET : 5,
  77. 	
  78. 	init : function(){
  79. 		this.setParameters();
  80. 		this.reconstructMethod();
  81. 		this.createElements();
  82. 		this.bindEvent();
  83. 		this.render();
  84. 	},
  85. 	setParameters : function(){
  86. 		this.$window = $(window);
  87. 		this.$container = $('#jsi-jellyfish-container');
  88. 		this.width = this.$container.width();
  89. 		this.height = this.$container.height();
  90. 		this.radius = Math.sqrt(Math.pow(this.width / 2, 2) + Math.sqrt(this.height/ 2, 2));
  91. 		this.distance = Math.sqrt(Math.pow(this.width, 2) + Math.sqrt(this.height, 2));
  92. 		this.canvas = $('<canvas />').attr({width : this.width, height : this.height}).appendTo(this.$container).get(0);
  93. 		this.context = this.canvas.getContext('2d');
  94. 		this.jellyfishes = [];
  95. 		this.theta = 0;
  96. 		this.x =  0;
  97. 		this.y =  0;
  98. 		this.destinationX = this.x;
  99. 		this.destinationY = this.y;
  100. 		this.dusts = [];
  101. 	},
  102. 	reconstructMethod : function(){
  103. 		this.render = this.render.bind(this);
  104. 	},
  105. 	getRandomValue : function(range){
  106. 		return range.min + (range.max - range.min) * Math.random();
  107. 	},
  108. 	createElements : function(){
  109. 		for(var i = 0, length = this.JELLYFISH_RATE * this.width * this.height; i < length; i++){
  110. 			this.jellyfishes.push(new JELLYFISH(this));
  111. 		}
  112. 		for(var i = 0, length = this.DUST_RATE * this.width * this.height; i < length; i++){
  113. 			this.dusts.push(new DUST(this));
  114. 		}
  115. 	},
  116. 	bindEvent : function(){
  117. 		this.$container.on('mousemove', this.translateCenter.bind(this, false));
  118. 		this.$container.on('mouseout', this.translateCenter.bind(this, true));
  119. 	},
  120. 	translateCenter : function(toAdjust, event){
  121. 		var offset = this.$container.offset();
  122. 		this.destinationX = event.clientX - offset.left + this.$window.scrollLeft();
  123. 		this.destinationY = event.clientY - offset.top + this.$window.scrollTop();
  124. 		
  125. 		if(!toAdjust){
  126. 			return;
  127. 		}
  128. 		if(this.destinationX < this.ADJUST_OFFSET){
  129. 			this.destinationX = 0;
  130. 		}else if(this.radius > this.width - this.ADJUST_OFFSET){
  131. 			this.destinationX = this.width;
  132. 		}
  133. 		if(this.destinationY < this.ADJUST_OFFSET){
  134. 			this.destinationY = 0;
  135. 		}else if(this.radius > this.height - this.ADJUST_OFFSET){
  136. 			this.destinationY = this.height;
  137. 		}
  138. 	},
  139. 	render : function(){
  140. 		requestAnimationFrame(this.render);
  141. 		
  142. 		if(this.destinationX > this.x){
  143. 			this.x = Math.min(this.x + this.ADJUST_DISTANCE, this.destinationX);
  144. 		}else{
  145. 			this.x = Math.max(this.x - this.ADJUST_DISTANCE, this.destinationX);
  146. 		}
  147. 		if(this.destinationY > this.y){
  148. 			this.y = Math.min(this.y + this.ADJUST_DISTANCE, this.destinationY);
  149. 		}else{
  150. 			this.y = Math.max(this.y - this.ADJUST_DISTANCE, this.destinationY);
  151. 		}
  152. 		var gradient = this.context.createRadialGradient(this.x, this.y, 0, this.x, this.y, this.radius);
  153. 		gradient.addColorStop(0, 'hsl(245, 100%, 50%)');
  154. 		gradient.addColorStop(0.3, 'hsl(245, 100%, 30%)');
  155. 		gradient.addColorStop(1, 'hsl(245, 100%, 10%)');
  156. 		this.context.fillStyle = gradient;
  157. 		this.context.fillRect(0, 0, this.width, this.height);
  158. 		
  159. 		for(var i = 0, length = this.dusts.length; i < length; i++){
  160. 			this.dusts[i].render(this.context, this.x, this.y);
  161. 		}
  162. 		for(var i = 0, length = this.jellyfishes.length; i < length; i++){
  163. 			this.jellyfishes[i].render(this.context, this.x, this.y);
  164. 		}
  165. 	}
  166. };
  167. var JELLYFISH = function(renderer){
  168. 	this.renderer = renderer;
  169. 	this.init(true);
  170. };
  171. JELLYFISH.prototype = {
  172. 	EXPANSION_RANGE : {min : Math.PI / 120, max : Math.PI / 30},
  173. 	DIRECTION_RANGE : {min : 0, max : Math.PI * 2},
  174. 	BASE_RANGE_X : {min : 10, max : 15},
  175. 	BASE_RANGE_Y : {min : 0, max : 5},
  176. 	BASE_RANGE_CP_X : {min : 20, max : 50},
  177. 	BASE_RANGE_CP_Y : {min : -40, max : -20},
  178. 	EXPANTION_OFFSET_RANGE : {min : 0.2, max : 0.5},
  179. 	EXTENSION_RATE_RANGE : {min : 0.5, max : 1.5},
  180. 	FEELER_LENGTH_RANGE : {min : 15, max : 30},
  181. 	FEELER_WIDTH_RANGE : {min : 2, max : 4},
  182. 	ACCELERATION_RATE : 0.2,
  183. 	OFFSET_TO_JUDGE : 100,
  184. 	FRICTION : 0.96,
  185. 	EXTENSION_COUNT : 100,
  186. 	
  187. 	init : function(toInit){
  188. 		this.radius = this.renderer.radius + this.OFFSET_TO_JUDGE * 2;
  189. 		
  190. 		if(toInit){
  191. 			this.x = this.renderer.getRandomValue({min : -this.OFFSET_TO_JUDGE, max : this.renderer.width + this.OFFSET_TO_JUDGE});
  192. 			this.y = this.renderer.getRandomValue({min : -this.OFFSET_TO_JUDGE, max : this.renderer.height + this.OFFSET_TO_JUDGE});
  193. 			this.direction = this.renderer.getRandomValue(this.DIRECTION_RANGE);
  194. 		}else{
  195. 			switch(condition = Math.random() * 4 | 0){
  196. 			case 0:
  197. 				this.x = -this.OFFSET_TO_JUDGE;
  198. 				this.y = this.renderer.getRandomValue({min : 0, max : this.renderer.height});
  199. 				this.direction = this.renderer.getRandomValue({min : Math.PI / 4, max : Math.PI * 3 / 4});
  200. 				break;
  201. 			case 1:
  202. 				this.x = this.renderer.getRandomValue({min : 0, max : this.renderer.width});
  203. 				this.y = -this.OFFSET_TO_JUDGE;
  204. 				this.direction = this.renderer.getRandomValue({min : Math.PI * 3 / 4, max : Math.PI * 5 / 4});
  205. 				break;
  206. 			case 2:
  207. 				this.x = this.renderer.width + this.OFFSET_TO_JUDGE;
  208. 				this.y = this.renderer.getRandomValue({min : 0, max : this.renderer.height});
  209. 				this.direction = this.renderer.getRandomValue({min : Math.PI * 5 / 4, max : Math.PI * 7 / 4});
  210. 				break;
  211. 			case 3:
  212. 				this.x = this.renderer.getRandomValue({min : 0, max : this.renderer.width});
  213. 				this.y = this.renderer.height + this.OFFSET_TO_JUDGE;
  214. 				this.direction = this.renderer.getRandomValue({min : Math.PI * 3 / 4, max : Math.PI * 5 / 4});
  215. 			}
  216. 		}
  217. 		this.expansion = 0;
  218. 		this.expansionDelta = this.renderer.getRandomValue(this.EXPANSION_RANGE);
  219. 		this.vx = 0;
  220. 		this.vy = 0;
  221. 		this.ax = Math.sin(this.direction) * this.expansionDelta * this.ACCELERATION_RATE;
  222. 		this.ay = -Math.cos(this.direction) * this.expansionDelta * this.ACCELERATION_RATE;
  223. 		this.baseX = this.renderer.getRandomValue(this.BASE_RANGE_X);
  224. 		this.baseY = this.renderer.getRandomValue(this.BASE_RANGE_Y);
  225. 		this.baseCPX = this.renderer.getRandomValue(this.BASE_RANGE_CP_X);
  226. 		this.baseCPY = this.renderer.getRandomValue(this.BASE_RANGE_CP_Y);
  227. 		this.expansionOffset = this.renderer.getRandomValue(this.EXPANTION_OFFSET_RANGE);
  228. 		this.feelerLength = this.renderer.getRandomValue(this.FEELER_LENGTH_RANGE);
  229. 		this.feelerWidth = this.renderer.getRandomValue(this.FEELER_WIDTH_RANGE);
  230. 		this.extensionRate = this.renderer.getRandomValue(this.EXTENSION_RATE_RANGE);
  231. 		this.theta = 0;
  232. 	},
  233. 	render : function(context, x, y){
  234. 		context.save();
  235. 		context.translate(this.x, this.y);
  236. 		context.rotate(this.direction);
  237. 		
  238. 		var opacity = 0.1 + 0.9 * Math.pow(1 - Math.min(1, Math.sqrt(Math.pow(this.x - x, 2) + Math.pow(this.y - y, 2)) / this.renderer.distance), 2),
  239. 			feelerColor = 'hsla(240, 80%, 80%, ' + 0.5 * opacity + ')',
  240. 			patternColor = 'hsla(240, 80%, 80%, ' + 0.8 * opacity + ')',
  241. 			gradient = context.createRadialGradient(0, this.baseCPY, 0, 0, this.baseCPY, this.baseY - this.baseCPY);
  242. 			
  243. 		gradient.addColorStop(0, 'hsla(245, 100%, 100%, ' + opacity + ')');
  244. 		gradient.addColorStop(0.5, 'hsla(245, 100%, 80%, ' + 0.6 * opacity + ')');
  245. 		gradient.addColorStop(1, 'hsla(245, 100%, 60%, ' + 0.4 * opacity + ')');
  246. 		
  247. 		context.fillStyle = gradient;
  248. 		context.strokeStyle = patternColor;
  249. 		context.lineWidth = 2;
  250. 		
  251. 		var baseX = this.baseX * (1 + this.expansionOffset * Math.cos(this.expansion)),
  252. 			theta = Math.PI / 2 - Math.abs((Math.PI - this.expansion)) / 2;
  253. 		
  254. 		context.save();
  255. 		this.createHead(context, baseX);
  256. 		context.restore();
  257. 		
  258. 		this.createMainPattern(context, baseX);
  259. 		this.createSubPattern(context, 0, this.baseCPY * 0.45, 0);
  260. 		this.createSubPattern(context, -7, this.baseCPY * 0.4, -theta);
  261. 		this.createSubPattern(context, 7, this.baseCPY * 0.4, theta);
  262. 		this.createFeeler(context, feelerColor);
  263. 		context.restore();
  264. 		
  265. 		if(this.expansion >= Math.PI - this.expansionDelta && this.expansion <= Math.PI){
  266. 			this.expansion += this.expansionDelta / this.EXTENSION_COUNT;
  267. 		}else{
  268. 			this.expansion += this.expansionDelta;
  269. 		}
  270. 		this.expansion %= Math.PI * 2;
  271. 		this.x += this.vx;
  272. 		this.y += this.vy;
  273. 		
  274. 		if(this.expansion >= 0 && this.expansion <= Math.PI){
  275. 			this.vx += this.ax;
  276. 			this.vy += this.ay;
  277. 		}
  278. 		this.vx *= this.FRICTION;
  279. 		this.vy *= this.FRICTION;
  280. 		
  281. 		this.judgeToReset();
  282. 	},
  283. 	createHead : function(context, baseX){
  284. 		context.beginPath();
  285. 		context.moveTo(-baseX, this.baseY);
  286. 		context.bezierCurveTo(-this.baseCPX, this.baseCPY, this.baseCPX, this.baseCPY, baseX, this.baseY);
  287. 		context.closePath();
  288. 		context.fill();
  289. 	},
  290. 	createMainPattern : function(context, baseX){
  291. 		context.beginPath();
  292. 		context.moveTo(-baseX * 0.6, this.baseY);
  293. 		context.bezierCurveTo(-this.baseCPX * 0.8, this.baseCPY * 0.5, this.baseCPX * 0.8, this.baseCPY * 0.5, baseX * 0.6, this.baseY);
  294. 		context.stroke();
  295. 	},
  296. 	createSubPattern : function(context, translateX, translateY, rotate){
  297. 		context.save();
  298. 		context.beginPath();
  299. 		context.translate(translateX, translateY);
  300. 		context.rotate(rotate);
  301. 		context.scale(1, 0.5);
  302. 		context.arc(0, 0, 4, 0, Math.PI * 2, false);
  303. 		context.stroke();
  304. 		context.restore();
  305. 	},
  306. 	createFeeler : function(context, feelerColor){
  307. 		for(var i = -3; i <= 3; i++){
  308. 			context.save();
  309. 			context.beginPath();
  310. 			context.strokeStyle = feelerColor;
  311. 			context.translate(i * 2, this.baseY);
  312. 			context.moveTo(0, 0);
  313. 			
  314. 			var x, cy;
  315. 			
  316. 			if(this.expansion >= 0 && this.expansion <= Math.PI){
  317. 				cy = (Math.PI - this.expansion) / Math.PI;
  318. 				x = i * this.feelerWidth * cy;
  319. 			}else{
  320. 				cy = (this.expansion - Math.PI) / Math.PI;
  321. 				x = i * this.feelerWidth * cy;
  322. 			}
  323. 			var rate = (cy > 0.5) ? (1 - cy) : cy;
  324. 			context.bezierCurveTo(x * this.extensionRate, this.feelerLength * rate, x * this.extensionRate, this.feelerLength * (1 - rate), x, this.feelerLength);
  325. 			context.stroke();
  326. 			context.restore();
  327. 		}
  328. 	},
  329. 	judgeToReset : function(){
  330. 		if(this.x < -this.OFFSET_TO_JUDGE && this.vx < 0 || this.x > this.renderer.width + this.OFFSET_TO_JUDGE && this.vx > 0
  331. 			|| this.y < -this.OFFSET_TO_JUDGE && this.vy < 0 || this.y > this.renderer.height + this.OFFSET_TO_JUDGE && this.vy > 0){
  332. 			this.init(false);
  333. 		}
  334. 	}
  335. };
  336. var DUST = function(renderer){
  337. 	this.renderer = renderer;
  338. 	this.init();
  339. };
  340. DUST.prototype = {
  341. 	RADIUS : 5,
  342. 	VELOCITY : 0.1,
  343. 	
  344. 	init : function(){
  345. 		var phi = this.renderer.getRandomValue({min : 0, max : Math.PI * 2});
  346. 		this.x = this.renderer.getRandomValue({min : 0, max : this.renderer.width});
  347. 		this.y = this.renderer.getRandomValue({min : 0, max : this.renderer.height});
  348. 		this.vx = this.VELOCITY * Math.sin(phi);
  349. 		this.vy = this.VELOCITY * Math.cos(phi);
  350. 		this.opacity = 0;
  351. 		this.theta = 0;
  352. 		this.deltaTheta = this.renderer.getRandomValue({min : Math.PI / 500, max : Math.PI / 100});
  353. 		this.gradient = this.renderer.context.createRadialGradient(0, 0, 0, 0, 0, this.RADIUS);
  354. 		this.gradient.addColorStop(0, 'hsla(220, 80%, 100%, 1)');
  355. 		this.gradient.addColorStop(0.1, 'hsla(220, 80%, 80%, 1)');
  356. 		this.gradient.addColorStop(0.25, 'hsla(220, 80%, 50%, 1)');
  357. 		this.gradient.addColorStop(1, 'hsla(220, 80%, 30%, 0)');
  358. 	},
  359. 	render : function(context, x, y){
  360. 		context.save();
  361. 		context.translate(this.x, this.y);
  362. 		context.globalAlpha = Math.abs(Math.sin(this.theta)) * (0.2 + 0.8 * Math.pow(Math.min(1, Math.sqrt(Math.pow(this.x - x, 2) + Math.pow(this.y - y, 2)) / this.renderer.distance), 2));
  363. 		context.fillStyle = this.gradient;
  364. 		context.beginPath();
  365. 		context.arc(0, 0, this.RADIUS, 0, Math.PI * 2, false);
  366. 		context.fill();
  367. 		context.restore();
  368. 		this.x += this.vx;
  369. 		this.y += this.vy;
  370. 		this.theta += this.deltaTheta;
  371. 		this.theta %= Math.PI * 2;
  372. 		
  373. 		if(this.x < -this.RADIUS || this.x > this.renderer.width + this.RADIUS
  374. 			|| this.y < -this.RADIUS || this.y > this.renderer.height + this.RADIUS){
  375. 			this.init();
  376. 		}
  377. 	}
  378. };
  379.  
  380. $(function(){
  381. 	RENDERER.init();
  382. 	layui.use(['layer', 'form'], function() {
  383. 		var layer = layui.layer,
  384. 			$ = layui.jquery,
  385. 			form = layui.form();
  386. 		//自定义验证规则
  387. 		form.verify({
  388. 			userName: function(value){
  389. 		      if(value.trim().length < 6){
  390. 		        return '用户名不能少于6位';
  391. 		      }
  392. 		    }
  393. 		    ,password: [/(.+){6,12}$/, '密码必须6到12位']
  394. 		 });
  395. 	});
  396. });
  397. </script>
  398.  
  399. </body>
  400. </html>

 四.炫酷蛛网

代码：

  1. <!DOCTYPE html>
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml" >
  4. <head>
  5.     <meta charset="UTF-8">
  6.     <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  7.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  8.     <meta http-equiv="pragma" content="no-cache">
  9.     <meta http-equiv="cache-control" content="no-cache">
  10.     <meta http-equiv="expires" content="0">
  11.  
  12.     <title>视联网云接入</title>
  13.     <link rel="icon" href="loginSpecial/images/favicon.ico" type="image/x-icon"/>
  14.     <link rel="shortcut icon" href="loginSpecial/images/favicon.ico" type="image/x-icon"/>
  15.     <link href="loginSpecial/css/default.css" rel="stylesheet" type="text/css" />
  16.     <!--必要样式-->
  17.     <link href="loginSpecial/css/styles.css" rel="stylesheet" type="text/css" />
  18.     <link href="loginSpecial/css/demo.css" rel="stylesheet" type="text/css" />
  19.     <link href="loginSpecial/css/loaders.css" rel="stylesheet" type="text/css" />
  20.     <script src="loginSpecial/js/jquery-2.1.1.min.js"></script>
  21.  
  22. </head>
  23. <body>
  24. <div class='login'>
  25.  
  26.   
  27.     <div class='login_title'>
  28.         <span>管理员登录</span>
  29.     </div>
  30.     <div class='login_fields'>
  31.         <div class='login_fields__user'>
  32.             <div class='icon'>
  33.  
  34.                 <img alt="" src='loginSpecial/img/user_icon_copy.png'>
  35.             </div>
  36.             <input name="login" placeholder='用户名' maxlength="16" class="username" type='text' autocomplete="off" value="admin"/>
  37.             <div class='validation'>
  38.                 <img alt="" src='loginSpecial/img/tick.png'>
  39.             </div>
  40.         </div>
  41.         <div class='login_fields__password'>
  42.             <div class='icon'>
  43.                 <img alt="" src='loginSpecial/img/lock_icon_copy.png'>
  44.             </div>
  45.             <input name="pwd" class="passwordNumder" placeholder='密码' maxlength="16" type='text' autocomplete="off">
  46.             <div class='validation'>
  47.                 <img alt="" src='loginSpecial/img/tick.png'>
  48.             </div>
  49.         </div>
  50.         <div class='login_fields__password'>
  51.             <div class='icon'>
  52.                 <img alt="" src='loginSpecial/img/key.png'>
  53.             </div>
  54.             <input name="code" placeholder='验证码' maxlength="4"  class="ValidateNum" type='text' name="ValidateNum" autocomplete="off">
  55.             <div class='validation' style="opacity: 1; right: -5px;top: -3px;">
  56.                 <canvas class="J_codeimg" id="myCanvas" onclick="Code();">对不起，您的浏览器不支持canvas，请下载最新版浏览器!</canvas>
  57.             </div>
  58.         </div>
  59.         <div class='login_fields__submit'>
  60.             <input type='button' value='登录'>
  61.         </div>
  62.     </div>
  63.     <div class='success'>
  64.     </div>
  65.     <div class='disclaimer'>
  66.         <p>欢迎登陆接入平台</p>
  67.     </div>
  68. </div>
  69. <div class='authent'>
  70.     <div class="loader" style="height: 60px;width: 60px;margin-left: 28px;margin-top: 40px">
  71.         <div class="loader-inner ball-clip-rotate-multiple">
  72.             <div></div>
  73.             <div></div>
  74.             <div></div>
  75.         </div>
  76.     </div>
  77.     <p>认证中...</p>
  78. </div>
  79. <div class="OverWindows"></div>
  80. <link href="loginSpecial/layui/css/layui.css" rel="stylesheet" type="text/css" />
  81. <script type="text/javascript" src="loginSpecial/js/jquery-ui.min.js"></script>
  82. <script type="text/javascript" src='loginSpecial/js/stopExecutionOnTimeout.js?t=1'></script>
  83. <script src="loginSpecial/layui/layui.js" type="text/javascript"></script>
  84. <script src="loginSpecial/js/Particleground.js" type="text/javascript"></script>
  85. <script src="loginSpecial/js/Treatment.js" type="text/javascript"></script>
  86. <script src="loginSpecial/js/jquery.mockjax.js" type="text/javascript"></script>
  87. <script src="loginSpecial/js/controlLogin.js" type="text/javascript"></script>
  88. </body>
  89. </html>

 五.彩色气泡

代码

  1. <!DOCTYPE html>
  2. <html lang="en">
  3.  
  4. <head>
  5.     <meta charset="UTF-8">
  6.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7.  
  8.     <link rel="stylesheet" href="style.css">
  9.  
  10.     <title>彩色气泡登录页</title>
  11. </head>
  12.  
  13. <body>
  14.     <section>
  15.         <!-- 背景颜色 -->
  16.         <div class="color"></div>
  17.         <div class="color"></div>
  18.         <div class="color"></div>
  19.         <div class="box">
  20.             <!-- 背景圆 -->
  21.             <div class="circle" style="--x:0"></div>
  22.             <div class="circle" style="--x:1"></div>
  23.             <div class="circle" style="--x:2"></div>
  24.             <div class="circle" style="--x:3"></div>
  25.             <div class="circle" style="--x:4"></div>
  26.             <!-- 登录框 -->
  27.             <div class="container">
  28.                 <div class="form">
  29.                     <h2>登录</h2>
  30.                     <form>
  31.                         <div class="inputBox">
  32.                             <input type="text" placeholder="姓名">
  33.  
  34.                         </div>
  35.                         <div class="inputBox">
  36.                             <input type="password" placeholder="密码">
  37.  
  38.                         </div>
  39.                         <div class="inputBox">
  40.                             <input type="submit" value="登录">
  41.  
  42.                         </div>
  43.                         <p class="forget">忘记密码?<a href="#">
  44.                                 点击这里
  45.                             </a></p>
  46.                         <p class="forget">没有账户?<a href="#">
  47.                                 注册
  48.                             </a></p>
  49.                     </form>
  50.                 </div>
  51.             </div>
  52.         </div>
  53.     </section>
  54. </body>
  55.  
  56. </html>

 

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/Cpp五条/article/detail/681068
推荐阅读