黑客帝国动态特效代码

黑客帝国动态特效代码（可以用自己想用的那些字来形成向下的流动型光柱）

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE> New Document </TITLE><META NAME="Generator" CONTENT="EditPlus"><META NAME="Author" CONTENT=""><META NAME="Keywords" CONTENT=""><META NAME="Description" CONTENT=""><style>/*basic reset*/
* {margin: 0; padding: 0;}
/*adding a black bg to the body to make things clearer*/
body {background: black;}
canvas {display: block;}</style></HEAD><BODY><canvas id="c"></canvas><script type="text/javascript" src="cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> <script>var c = document.getElementById("c");
var ctx = c.getContext("2d");//making the canvas full screen
c.height = window.innerHeight;
c.width = window.innerWidth;//chinese characters - taken from the unicode charset
var chinese = "田由甲申甴电甶男甸甹町画甼甽甾甿畀畁畂畃畄畅畆畇畈畉畊畋界畍畎畏畐畑";
//converting the string into an array of single characters
chinese = chinese.split("");var font_size = 10;
var columns = c.width/font_size; //number of columns for the rain
//an array of drops - one per column
var drops = [];
//x below is the x coordinate
//1 = y co-ordinate of the drop(same for every drop initially)
for(var x = 0; x < columns; x++)drops[x] = 1; //drawing the characters
function draw()
{//Black BG for the canvas//translucent BG to show trailctx.fillStyle = "rgba(0, 0, 0, 0.05)";ctx.fillRect(0, 0, c.width, c.height);ctx.fillStyle = "#0F0"; //green textctx.font = font_size + "px arial";//looping over dropsfor(var i = 0; i < drops.length; i++){//a random chinese character to printvar text = chinese[Math.floor(Math.random()*chinese.length)];//x = i*font_size, y = value of drops[i]*font_sizectx.fillText(text, i*font_size, drops[i]*font_size);//sending the drop back to the top randomly after it has crossed the screen//adding a randomness to the reset to make the drops scattered on the Y axisif(drops[i]*font_size > c.height && Math.random() > 0.975)drops[i] = 0;//incrementing Y coordinatedrops[i]++;}
}setInterval(draw, 33);</script></BODY>
</HTML>

黑客帝国动态特效代码相关推荐

CSS3全屏星空动态特效代码
CSS3全屏星空动态特效代码,可用于简约的星空表白页面,大气的文字内容动态背景特效. 更多源码下载:hereitis,在这里资源站,免费软件下载,PPT.图片素材下载,精品小工具小插件
html鼠标平滑滚动效果,JS特效代码 JS动态平滑滚动菜单效果
JS特效代码 JS动态平滑滚动菜单效果 www.css5.net body {cursor:crosshair; background:#111; margin:0; padding:0; posit ...
文字动态发光特效代码简单实现
第一种方法: <html><head><title>文字动态发光特效代码</title></head><body bgcolor=&q ...
【HTML实现弹幕滚动效果和文字动态发光特效代码】
HTML实现弹幕滚动效果我们经常会在看电影的时候,打开弹幕,以此来查看网友们对电影的实时评价.面对屏幕上一条一条滚动的弹幕,到底是如何实现的呢? 下面我们来介绍用HTML实现弹幕滚动的方法. 1 ...
漂亮的网页动态飘花灯笼特效代码
好看的动态飘花灯笼特效代码可直接将代码复制粘贴到各种页面底部使用! 若需要全站可直接将代码复制粘贴到footer.php或footer.html等脚模板底部区域文件使用提示:加显示判断函数,代码必 ...
JS打字效果的动态菜单代码分享
这篇文章主要介绍了JS打字效果的动态菜单,推荐给大家,有需要的小伙伴可以参考下. 这是一款基于javascript实现的打字效果的动态菜单特效代码,分享给大家学习学习. 小提示:浏览器中如果不能正常运 ...
各大门户网站Flash和JS实现的图片幻灯片切换特效代码文件下载:
最近看到各大门户站都有一个幻灯片特效,而且不是简单的JS特效,是FLASH和JS结合而成的觉得非常不错,今天在IT世界的原代码中查看了一下,特此发布!希望大家喜欢!有什么问题可以与我研究!<a ...
HTML中淡入的动画效果,CSS3实现页面淡入动画特效代码
现在的css3有很多效果可以直接替换flash了,下面我来给大家介绍一个利用CSS3实现页面淡入动画特效代码,希望此教程对各位同学会有所帮助. 利用CSS3动画属性"@keyframes ...
【照片动态特效系列】旋转吧，照片！
[照片动态特效系列]旋转吧,照片! 实现"旋转" 核心-二维仿射变换基础旋转分块旋转多方向+彩图核彩图处理心部分主函数其他 by 今天不飞了突然就想做,然后就做了-- ...
java 九大行星运行_html5 canvas太阳系九大行星运行动态图代码
特效描述:html5 canvas 太阳系九大行星运行动态图代码.html5 canvas这个动画加上了每个行星的名称,只要鼠标移入目标行星就会显示. 代码结构 1. HTML代码你浏览器不支持 ...

黑客帝国动态特效代码

黑客帝国动态特效代码（可以用自己想用的那些字来形成向下的流动型光柱）

黑客帝国动态特效代码相关推荐

最新文章

热门文章