【特效】js打造黑客帝国文字特效

最新推荐文章于 2023-09-13 01:09:45 发布

lovqc

最新推荐文章于 2023-09-13 01:09:45 发布

阅读量1.6k

点赞数

分类专栏： web前端之路文章标签： javascript web前端开发黑客帝国特效

本文链接：https://blog.youkuaiyun.com/lovqc/article/details/50326931

版权

不多说，直接贴代码

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>document</title>
	<style type="text/css">
		body{
			background: #111;
		}
		#cont{
			background: #000;
			width: 600px;
			height: 800px;
			margin: 20px auto;
			position: relative;
		}
		.divbox{ 
			position: absolute;
			top:0px;
			width: 6px;
		}
		.snows{  
			display: block;
		}

	</style>
	
</head>
<body> 
	<div id="cont"> 
	</div>
	<button id="btn">停止</button>
	<button id="start">开始</button>
	<script type="text/javascript">
		// 获取元素
		var $snows = document.getElementsByTagName('span');
		var $cont = document.getElementById('cont') 
		var $btn = document.getElementById('btn') 
		var $start = document.getElementById('start') 
		var _top,
			_left