changzheng-H5/js/snow.js

function win(attr) { //获取可视区尺寸，参数为height|width
	// 横屏
	var detectOrient = function() {
		var width = document.documentElement.clientWidth,
			height = document.documentElement.clientHeight,
			wrapper = document.getElementById("wrap"),
			style = "";
		if(width >= height) { // 竖屏
			style += "width:100%";
			style += "height:100%;";
			style += "-webkit-transform: rotate(0); transform: rotate(0);";
			style += "-webkit-transform-origin: 0 0;";
			style += "transform-origin: 0 0;";
		} else { // 横屏
			style += "width:" + height + "px;"; // 注意旋转后的宽高切换
			style += "height:" + width + "px;";
			style += "-webkit-transform: rotate(90deg); transform: rotate(90deg);";
			// 注意旋转中点的处理
			style += "-webkit-transform-origin: " + width / 2 + "px " + width / 2 + "px;";
			style += "transform-origin: " + width / 2 + "px " + width / 2 + "px;";
		}
		wrapper.style.cssText = style;
	}
	window.onresize = detectOrient;
	detectOrient();
}
window.onload = function() {
	var bd = document.getElementsByClassName('snowList'); //获取body
	function snow() { //雪花函数
		
		var win_height = '100%'; //获取窗口高度
		var win_width = document.documentElement.clientHeight; //获取窗口宽度
		function createsnow() { //创建雪花函数
			var snowdiv = document.createElement('div'); //新建一个div
			snowdiv.className = 'snow'
			snowdiv.innerHTML = "j"; //写入雪花（字体的代码为j）
			var size = 20 + parseInt(Math.random() * 30); //随机生成雪花的大小
			var left = parseInt(win_width * (Math.random()) * 0.98); //随机生成left值
			snowdiv.style.fontSize = size + 'px'; //应用字体大小
			snowdiv.style.width = size + 'px'; //div应用宽度
			snowdiv.style.height = size + 'px'; //div应用高度
			snowdiv.style.left = left + 'px'; //雪花的left值
			$('.snowList').append(snowdiv)
//			bd.append(snowdiv); //将此雪花放入文档中
			return snowdiv; //返回这个雪花对象
		}
		setInterval(function() {
			var snow = createsnow(); //创建雪花并得到这一对象
			var sbd = Math.ceil(Math.random() * 10); //随机生成下落速度
			move(snow, sbd); //移动雪花
		}, 100);

		function move(obj, speed) { //移动函数
			var top = 0;
			var timer = setInterval(
				function() {
					top = top + speed; //改变top值
					obj.style.top = top + 'px';
					if(top > win_height - 20) {
						clearInterval(timer); //下落停止
					}
				}, 30);
		}
		setInterval(function() { //一段时间之后清理一次雪花，防止文档过大卡住
			var snows = document.getElementsByClassName('snow');
			for(var i = 0; i < snows.length / 3; i++) {
				snows[i].parentNode.removeChild(snows[i]);
			}
		}, 5000);
	}
	snow(); //执行snow函数
	window.onresize = function() { //窗口改变
		var snows = document.getElementsByTagName('div');
			snows.className="snow"
		for(var i = 0; i < snows.length; i++) {
			snows[i].parentNode.removeChild(snows[i]);
		}
	}
}