网页中黑客滚动背景

向网页中添加黑客效果的滚动背景，使用网页看起来“高大上”。

实现黑客帝国黑客电脑上的代码滚动效果。

效果如下：

需要jquery支持，如果不想引入jquery的，可以自己修改下。

  
var hkcode_t;
function hkcode() {
	$('body').prepend('<canvas id="c"  style="position: fixed; top: 0;left: 0; opacity: 1;"></canvas>');
    if (hkcode_t) {
        clearInterval(hkcode_t);
    }
    var c = document.querySelector("#c");
    var ctx = c.getContext("2d");
    ctx.fillStyle = 'rgba(255, 255, 255, 0)';
    c.height = window.innerHeight;
    c.width = window.innerWidth;
    var chinese = "0123456789qwertyuiopasdfghjklzxcvbnm,./;'[]QWERTYUIOP{}ASDFGHJHJKL:ZXCVBBNM<>?がガぎギぐグげゲごゴきゃキャきゅキュきょキョりゃリャゅリュりょリョ";
    chinese = chinese.split("");
    var font_size = 10;
    var columns = c.width / font_size;
    var drops = [];
    for (var x = 0; x < columns; x++) drops[x] = 1;  
	for(var ii=0;ii<250;ii++){
		for (var i = 0; i < drops.length; i++) {          
                              
			if (drops[i] * font_size > c.height && Math.random() > 0.975) drops[i] = 0;
            drops[i]++;
        }
	}
    function draw() {        
        ctx.fillStyle = "rgba(0, 0, 0, 0.05)";
        ctx.fillRect(0, 0, c.width, c.height);
        ctx.fillStyle = "#0F0"; //green text         
        ctx.font = font_size + "px arial";     
        for (var i = 0; i < drops.length; i++) {          
            var text = chinese[Math.floor(Math.random() * chinese.length)];  
			ctx.fillText(text, i * font_size, drops[i] * font_size);                       
			if (drops[i] * font_size > c.height && Math.random() > 0.975) drops[i] = 0;
            drops[i]++;
        }
    }
    hkcode_t = setInterval(draw, 50);
}
hkcode();
$(function() {
    $(window).resize(function() {
        hkcode();
    });
});