<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 = 0x <columnsx++){
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 = 0i <drops.lengthi++){
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>
<!--使用position:absolutez-index:100--><canvas id="q"></canvas>
<div id="main" style=" position:absolutez-index:100top:10pxwidth:960pxheight:400pxbackground: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><style 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:absolutetop:0left:-"+Cs+"'>")
document.write(" <div style='position:relative'>")
for(i=0i <Colsi++){
S[i]=I+=Cs
document.write(" <div id='A' style='position:absolutetop:0font-family:Arialfont-size:"
+Ts+"pxleft:"+S[i]+"width:"+Ts+"pxheight:0pxcolor:"+Tc+"visibility:hidden'></div>")
}
document.write(" </div></div>")
for(j=0j <Colsj++){
RC[j]=1+Math.round(Math.random()*Cl)
Y[j]=0
Sp[j]=Math.round(MnS+Math.random()*MxS)
for(i=0i <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=0i <Colsi++){
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=0i2 <Colsi2++){
RC[i2]=1+Math.round(Math.random()*Cl)
for(i3=0i3 <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>
演示地址：
http://www.toto369.net/jdtx/hkdg.htm
网上找的代码，我给你改了下
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）