黑客效果html代码

分享一段html黑客特效代码,这套代码可以实现显示出电视剧当中演出的黑客代码特效效果,页面显示的黑客效果高端大全,非常的有层次感,主要是用来跟别人炫耀的,演示给其他不懂电脑的小白,还是很让人羡慕的。

这段代码我已经试验过了,打开的界面中会出现黑色背景,背景上面有绿色的数字滚动,特别像是电视上面演的一些黑客告诉,电脑上显示一些奇怪有层次感的东西,我们如果用这个东西给别人看,去炫耀还是很有用的,给不懂的人看还是会让人觉得很牛的,具体看下面的演示图,图片可能不太清晰,但是效果很好。

黑客效果代码html

我们首先在电脑上新建文本文档,将下方代码拷贝到文档中,然后把文本后缀txt改为html,双击打开此文件就可以看到效果了。

<!-- 黑客效果代码开始 -->
<html>
<head>
<title>Do You Know HACKER-2</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"
type="text/javascript"></script>
</head>
<body>
<div align="center">
<canvas id="myCanvas" width="1024" height="800" style="border:1px solid #c3c3c3;">
Your browser does not support the HTML5 canvas tag.
</canvas>
<script type="text/javascript">
var YPositions = Array(51).join(0).split('');
/*
join() 方法用于把数组中的所有元素放入一个字符串
split() 方法用于把一个字符串分割成字符串数组
*/
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
var draw = function () {
ctx.fillStyle = 'rgba(0,0,0,.05)';
ctx.fillRect(0, 0, 1024, 800); ctx.fillStyle = "#0f0";
YPositions.map(function (y, index) {
/*
map() 把每个元素通过函数传递到当前匹配集合中,生成包含返回值的新的 jQuery 对象
*/
x = (index * 10);
ctx.fillText(parseInt(Math.random() * 10), x, y);
/*
在(x,y)坐标位产生一个'a'字符
index为Ypositions的下标
*/
if (y > 500) {
YPositions[index] = 0;
} else {
YPositions[index] = y + 10;
}
/*
如果新产生的字符已经到了<canvas>的辩解
那么就使产生下一个新字符的位置回归到原点
*/
});
};
setInterval(draw, 30);
</script>
</body>
</html>
<!-- 黑客效果代码结束 -->

免责声明:

本站提供的资源,都来自网络,版权争议与本站无关,所有内容及软件的文章仅限用于学习和研究目的。不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负,我们不保证内容的长久可用性,通过使用本站内容随之而来的风险与本站无关,您必须在下载后的24个小时之内,从您的电脑/手机中彻底删除上述内容。如果您喜欢该程序,请支持正版软件,购买注册,得到更好的正版服务。侵删请致信E-mail:ys0006@163.com

标签

发表评论