HTML5模仿黑客帝国文字矩阵特效，怎么样可以确定文字显示
!DOCTYPE html
html
head
title黑客帝国效果/title
/head
body
canvas id="canvas"/canvas
style type="text/css"
body{margin: 0;
padding: 0;
overflow: hidden;}
/style
script type="text/javascript"
var canvas = document.getElementById('canvas');
var ctx = canvas.getContext('2d');
canvas.height = window.innerHeight;
canvas.width = window.innerWidth;
var texts = '0123456789'.split('');
var fontSize = 16;
var columns = canvas.width/fontSize;// 用于计算输出文字时坐标，所以长度即为列数
var drops = [];//初始值
for(var x = 0; x columns; x++){
drops[x] = 1;
function draw(){
//让背景逐渐由透明到不透明
ctx.fillStyle = 'rgba(0, 0, 0, 0.05)';
ctx.fillRect(0, 0, canvas.width, canvas.height);//文字颜色
ctx.fillStyle = '#0F0';
ctx.font = fontSize + 'px arial';//逐行输出文字
for(var i = 0; i drops.length; i++){
var text = texts[Math.floor(Math.random()*texts.length)];
ctx.fillText(text, i*fontSize, drops[i]*fontSize);
if(drops[i]*fontSize canvas.height || Math.random() 0.95){
drops[i] = 0;
drops[i]++;}}
setInterval(draw, 33);
/script
/body
谁教我黑客帝国那个数据流的特效
这个是网上最经典的一个做数字雨的教程
前期用PS，后期合成用AE，整合在一张比较大的图片上了，你需耐心一些
帮我说说这个网页特效怎么制作的。最好能帮我搞到代码。高分送。
以下就是他的网页代码：
HTML
HEAD
TITLE中关村网友社区 - 《给你一个故事》/TITLE
META http-equiv=Content-Type content="text/html; charset=gb2312"
STYLE type=text/css
TD {FONT-SIZE: 14px; LINE-HEIGHT: 28px}
/STYLE
BGSOUND balance=0 src="love8.mid" volume=0 loop="-1"
/HEAD
BODY bgProperties=fixed background=love8.JPG
SCRIPT language=VBScript
dim w,t,p,mm,c,mr,dy,tmp,vs:vs=5:dy=1:p=1:mr="BRBRBR":c="font color=whiteB|"mr:Set w = document.body
sub tp
m=mid(t,p,1):if m="" then c=mr
if m="`" then m="":mm=mid(mm,1,len(mm)-1)
if m="" then av=instr(mid(t,p),""):m=mid(t,p,av):p=p+av-1
if m="" then av=instr(mid(t,p),";"):m=mid(t,p,av):p=p+av-1
tmp=100:if m="." then tmp=400 else if m="," then tmp=200 else if m=" " then tmp=200
if w.scrollHeight-w.scrollTopw.offsetHeight then w.scrollTop=w.scrollTop+int(dy):dy=dy+dy/vs else dy=1
mm=mmm:w1.innerHTML=mmc:p=p+1:if p=len(t)+1 then SetTimeOut "tp",16+tmp else w.scroll="yes"
end sub
sub window_onload()
w.scroll="yes"
w.bgcolor="#A8A8A8"
w.style.cursor="crosshair"
t=w0.innerHTML:tp
end sub
/SCRIPT
DIV id=w0 style="DISPLAY: none; WIDTH: 671px; HEIGHT: 2186px"
TABLE width="90%" align=center border=0
TR
TD
P align=centerfont face="华文行楷" color="#990066" size="4"人的一生会遇上的四个人 /fontFONT face=华文行楷 color=#cc66ff
size=4B /B/FONT/P
P
align=left
img src="love81.gif" width="330" height="200"/P P align=leftFONT face=华文中宋 color=#ff99cc
size=3 人生就是为了找寻爱的过程，每个人的人生都要找到四个人。img src="love82.gif" width="95" height="50"/FONT/P
P align=leftFONT face=华文中宋 color=#3399ffFONT
size=2
/FONT/FONTFONT face=华文中宋 size=3FONT
color=#3399ff第一个是自己,BR
第二个是你最爱的人，BR
第三个是最爱你的人，BR
第四个是共度一生的人.BR
首先会遇到你最爱的人，然后体会到爱的感觉；BR
因为了解被爱的感觉，所以才能发现最爱你的人；BR
当你经历过爱人与被爱，学会了爱，才会知道什么是你需要的，BR
也才会找到最适合你，能够相处一辈子的人。BR
但很悲哀的，在现实生活中，这三个人通常不是同一个人；BR
你最爱的，往往没有选择你；BR
最爱你的，往往不是你最爱的；BR
而最长久的，偏偏不是你最爱也不是最爱你的，BR
只是在最适合的时间出现的那个人。BR
你，会是别人生命中的第几个人呢？/FONTFONT
color=#ff99ccBR
/FONTFONT
color=#3399ff没有人是故意要变心的，他爱你的时候是真的爱你，BR
可是他不爱你的时候也是真的不爱你了，BR
他爱你的时候没有办法假装不爱你；BR
同样的，他不爱你的时候也没有办法假装爱你
。BR
当一个人不爱你要离开你，BR
你要问自己还爱不爱他，BR
如果你也不爱他了，千万别为了可怜的自尊而不肯离开；BR
如果你还爱他，你应该会希望他过得幸福快乐，BR
希望他跟真正爱的人在一起，绝不会阻止，BR
你要是阻止他得到真正的幸福，就表示你已经不爱他了，BR
而如果你不爱他，你又有什么资格指责他变心呢？BR
爱不是占有，BR
你喜欢月亮，不可能把月亮拿下来放在脸盆里，BR
但月亮的光芒仍可照进你的房间。BR
换句话说，你爱一个人，也可以用另一种方式拥有，BR
让爱人成为生命里的永恒回忆，BR
如果你真爱一个人，就要爱他原来的样子—爱他的好，也爱他的坏：BR
爱他的优点，也爱他的缺点，BR
绝不能因为爱他，就希望他变成自己所希望的样子，BR
万一变不成就不爱他了。BR
真正爱一个人是无法说出原因的，BR
你只知道无论何时何地、心情好坏，你都希望这个人陪著你；BR
真正的感情是两人能在最艰苦中相守，也就是没有丝毫要求。BR
毕竟，感情必须付出，而不是只想获得；BR
分开是一种必然的考验，BR
如果你们感情不够稳固，只好认输，BR
真爱是不会变成怨恨的。BR
两人在谈情说爱的时候，BR
最喜欢叫对方发誓，许下承诺我们为什么要对方发誓，BR
就是因为我们不相信对方，我们根本不相信情人，BR
而这些山盟海誓又很不切实际：BR
海枯石烂、地老天荒，都不能改变我对你的爱!BR
明知道海不会枯、石不会烂、地不会老、天不会荒；BR
就算会，也活不到那时候。BR
许下诺言的时候千万注意，不要许下可以实现的诺言，BR
最好是承诺做不到的事，BR
反正做不到的，随便说说也不要紧，BR
请记住：”不可能实现的诺言最动人”BR
在爱情里，说的是一套，做的是另一套；BR
讲的人不相信，听的人也不相信。BR
你呢？找到了第几个？BR
茫茫人海中，你遇见了谁？谁又遇见了你？/FONT/FONT/P
P align=left img src="love83.gif" width="256" height="48"/P
P FONT color=#ff0000转给0-4人：你的生活会悄悄起变化/FONT/P
P FONT color=#ff0000转给5-9人：生活如你所愿/FONT/P
P FONT color=#ff0000转给9-14人：接下来的三个星期你会有惊喜的发现/FONT/P
P FONT color=#ff0000转给15人以上：你的梦想终会成真./FONT /P
P 这是一个朋友转发给我的信。常常收到类似的让我继续转发的邮件，号称如果这样做了就会怎么样之类，通常我会把自己作为终点，但是这封信打动了我，因为它说："收到了这封信，是因为有人在默默的祝福，因为你也爱你身边的一些人"。带着爱的，一切将如愿以偿。/P
P 这是一封给你送上好运的信，它始于新英格兰。此信的复制由南非教区主教索尔安东尼起草并由维尼乌拉发出，已经绕地球转了十次。现在好运已降临到你身上，只要你照办，将此信复制2O份分别寄给亲朋好友，使它在界各地周转，你将在四天内交到好运，这不是在开玩笑，不需要寄钱，因为幸运是无代价的。/P
P
Bfont face="宋体"你看到了吗？我在默默的祝福你。SPAN lang=EN-US
style="FONT-FAMILY: PMingLiU; mso-bidi-font-family: 宋体"*^_^* /SPAN/font/B/P
Pfont face="宋体"BSPAN lang=EN-US
style="mso-bidi-font-family: 宋体"
FONT face=PMingLiU
/FONT/SPAN/SPAN/B/P
/TD/TR/TABLE/DIV
DIV id=w1/DIV
P align=center /PBRBR
style
BODY {SCROLLBAR-FACE-COLOR: #FB7C7C; SCROLLBAR-HIGHLIGHT-COLOR: #FFFFFF; SCROLLBAR-SHADOW-COLOR: #FFFFFF; SCROLLBAR-3DLIGHT-COLOR: #FFD4D4; SCROLLBAR-ARROW-COLOR: #FFFFFF; SCROLLBAR-TRACK-COLOR: #FFD4D4; SCROLLBAR-DARKSHADOW-COLOR: #FFFFFF; }
/style
style type="text/css"
p, td, select { font-size: 9pt }
a { color: black; font-size: 9pt; text-decoration: none }
a:hover { color: red; text-decoration: underline overline }
.drop { filter: dropshadow(color=000000, offx=1, offy=1, positive=1) }
.drop2 { filter: dropshadow(color=FFFFFF, offx=1, offy=1, positive=1) }
/style
script language="JavaScript"
if (window.Event)
document.captureEvents(Event.MOUSEUP);
function nocontextmenu()
event.cancelBubble = true
event.returnValue = false;
return false;
function norightclick(e)
if (window.Event)
if (e.which == 2 || e.which == 3)
return false;
else
if (event.button == 2 || event.button == 3)
event.cancelBubble = true
event.returnValue = false;
return false;
document.oncontextmenu = nocontextmenu; // for IE5+
document.onmousedown = norightclick; // for all others
/script
/BODY
/HTML
怎么把黑客帝国的这段代码放在html主页的背后
!--使用position:absolute;z-index:100;--
canvas id="q"/canvas
div id="main" style=" position:absolute;z-index:100;top:10px;width:960px;height:400px;background:red;"123/div
script type="text/javascript"
var s = window.screen;
var width = q.width = s.width;
var height = q.height = s.height;
var letters = Array(256).join(1).split('');
var _div=document.getElementById("main");
_div.style.left=(width-960)/2+"px";//给主页面left定位;
var draw = function () {
q.getContext('2d').fillStyle='rgba(0,0,0,.05)';
q.getContext('2d').fillRect(0,0,width,height);
q.getContext('2d').fillStyle='#0F0';
letters.map(function(y_pos, index){
text = String.fromCharCode(3e4+Math.random()*33);
x_pos = index * 10;
q.getContext('2d').fillText(text, x_pos, y_pos);
letters[index] = (y_pos 758 + Math.random() * 1e4) ? 0 : y_pos + 10;
setInterval(draw, 33);
/script
我要黑客帝国里的数字流星雨代码，用html或asp写的
htmlstyle type="text/css"
body {
background-color: #000000;
/style
Body
script language="JavaScript"
if (document.all){
Cols=60;
Cl=20;//Space's are included so real length is 48!
Cs=20;
Ts=20;
Tc='#008800';
Tc1='#00ff00';
MnS=20;
MxS=30;
I=Cs;
Sp=new Array();S=new Array();Y=new Array();
C=new Array();M=new Array();B=new Array();
RC=new Array();E=new Array();Tcc=new Array(0,1);
document.write(" div id='Container' style='position:absolute;top:0;left:-"+Cs+"'");
document.write(" div style='position:relative'");
for(i=0; i Cols; i++){
S[i]=I+=Cs;
document.write(" div id='A' style='position:absolute;top:0;font-family:Arial;font-size:"
+Ts+"px;left:"+S[i]+";width:"+Ts+"px;height:0px;color:"+Tc+";visibility:hidden' /div");
document.write(" /div /div");
for(j=0; j Cols; j++){
RC[j]=1+Math.round(Math.random()*Cl);
Y[j]=0;
Sp[j]=Math.round(MnS+Math.random()*MxS);
for(i=0; i RC[j]; i++){
B[i]='';
C[i]=Math.round(Math.random()*1)+' ';
M[j]=B[0]+=C[i];
function Cycle(){
Container.style.top=window.document.body.scrollTop;
for (i=0; i Cols; i++){
var r = Math.floor(Math.random()*Tcc.length);
E[i] = ' font color='+Tc1+''+Tcc[r]+' /font';
Y[i]+=Sp[i];
if (Y[i] window.document.body.clientHeight){
for(i2=0; i2 Cols; i2++){
RC[i2]=1+Math.round(Math.random()*Cl);
for(i3=0; i3 RC[i2]; i3++){
B[i3]='';
C[i3]=Math.round(Math.random()*1)+' ';
C[Math.floor(Math.random()*i2)]=' '+' ';
M[i]=B[0]+=C[i3];
Y[i]=-Ts*M[i].length/1.5;
A[i].style.visibility='visible';
Sp[i]=Math.round(MnS+Math.random()*MxS);
A[i].style.top=Y[i];
A[i].innerHTML=M[i]+' '+E[i]+' ';
setTimeout('Cycle()',20)
Cycle();
/script
/body
/html
演示地址：
网上找的代码，我给你改了下
OLLBAR-HIGHLIGHT-COLOR: #FFFFFF; SCROLLBAR-SHADOW-COLOR: #FFFFFF; SCROLLBAR-3DLIGHT-COLOR: #FFD4D4; SCROLLBAR-ARROW-COLOR: #FFFFFF