自己写的黑客落幕特效

<!DOCTYPE html>
<html>
<head>
   <title>矩阵特效</title>
<meta charset="utf-8" />
<meta name="keywords" content="" />
<meta name="description" content="" />
   <style type="text/css"> *{margin: 0;padding: 0; } body{font-size: 12px; font-family: "微软雅黑"; color: #666; } </style>
</head>
<body>
   <canvas id="mycanvas"> </canvas>

   <script type="text/javascript">

       var winW;
       var winH;
       winW = window.screen.width;
       winH = window.screen.height;
       var canvas = document.getElementById("mycanvas");
       canvas.width = winW;
       canvas.height = winH;
       var cxt = canvas.getContext("2d");
       cxt.fillStyle = "black";
       cxt.fillRect(0,0,winW,winH);

       var str = "qwrygguiaieurgwuietgrweuigiwgb";
       var fontSize = 30;
       var clos = Math.floor(winW/fontSize);


       var array = new Array();
       for (var i=0;i<clos;i++){
           array.push(Math.random()*winH);
       }

       function drawStr(){
           cxt.fillStyle = "rgba(0,0,0,0.3)";
           cxt.fillRect(0,0,winW,winH);
           cxt.font = "700 "+fontSize+"px 微软雅黑";
           cxt.fillStyle = randomColor();
           for (var i = 0; i < clos; i++){
               var x = fontSize*i;
               var y = array[i]*fontSize;
       var indexStr = Math.floor(Math.random()*str.length);

               cxt.fillText(str[indexStr],x,y);
               if(y>canvas.height && Math.random()>0.96){
                   array[i] = 0;
               }
               array[i]++;
           }
       }

       function randomColor(){
           var R = Math.floor(Math.random()*256);
           var G = Math.floor(Math.random()*256);
           var B = Math.floor(Math.random()*256);
           return "rgb"+"("+R+","+G+","+B+")";
       }

   setInterval(drawStr,33);

   </script>

</body>
</html>