three打造下雪效果

代码语言:html

所属分类:三维

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!doctype html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/jquery.17.js"></script>
<title>雪花</title>
<style type="text/css">
		body {
			width: 100%;
			height: 100%;
			background-color: #5569ae;
		
			background-size: 100% auto;
		}

		.snow-container {
			position: fixed;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			pointer-events: none;
			z-index: 100001;
		}
	</style>
</head>
<body>
<div class="snow-container"></div>

<script type="text/javascript" src="https://cdn.bootcss.com/three.js/r52/three.min.js"></script>
<script type="text/javascript">
		function randomRange(t, i) {
			return Math.random() * (i - t) + t
		}
		Particle3D = function (t) {
				THREE.Particle.call(this, t), this.velocity = new THREE.Vector3(0, -2, 0), this.velocity.rotateX(randomRange(-
						45, 45)), this.velocity.rotateY(randomRange(0, 360)), this.gravity = new THREE.Vector3(0, 0, 0), this
					.drag = 1
			}, Particle3D.prototype = new THREE.Particle, Particle3D.prototype.constructor = Particle3D, Particle3D.prototype
			.updatePhysics = function () {
				this.velocity.multiplyScalar(this.drag), this.velocity.addSelf(this.gravity), this.position.addSelf(this
					.velocity)
			};
		var TO_RADIANS = Math.PI / 180;
		THREE.Vector3.prototype.rotateY = function (t) {
			cosRY = Math.cos(t * TO_RADIANS), sinRY = Math.sin(t * TO_RADIANS);
			var i = this.z,
				o = this.x;
			this.x = o * cosRY + i * sinRY, this.........完整代码请登录后点击上方下载按钮下载查看

网友评论0