黑客帝国：矩阵革命

天下无双 · 发表于 2014-11-14 18:28:00

[mw_shl_code=css,true]<!DOCTYPE html>

<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Martrix</title>
<style>
      body {
         margin: 0;
         padding: 0;
         background-color: #000;
         overflow: hidden;
         color:#e6922a;
      }
</style>
</head>
<body>
<canvas id="canvas"></canvas>

<script type="text/javascript">
      var canvas = document.getElementById("canvas"),
         context = canvas.getContext("2d");

      var fontSize = 12,
         listText = "abcdefghijklmnopqrstuvwxyz       ".split(""),
         column, row,
         listColumn = [];

      function draw() {
         //画背景
         context.fillStyle = "rgba(0, 0, 0, 0.05)";
         context.fillRect(0, 0, canvas.width, canvas.height);
         context.save();

         //画Logo
         context.shadowColor = "#074425";
         context.shadowBlur = parseInt(Math.random() * 40 + 1);
         context.font = "bold 36px Arial";
         context.fillStyle = "#eefbf5";
         context.fillText("ITSVSE.COM", (canvas.width / 2 - context.measureText("ITSVSE.COM").width / 2), canvas.height - 200);
         context.fillText("武软论坛", (canvas.width / 2 - context.measureText("武软论坛").width / 2), canvas.height - 165);
         context.font = "16px Microsoft Yahei";
         context.fillText("黑客帝国：矩阵革命", (canvas.width / 2 - context.measureText("黑客帝国：矩阵革命").width / 2), canvas.height - 100);

         //画代码
         context.restore();
         context.font = "normal " + fontSize + "px Arial";
         context.fillStyle = "#12ee46";
         for (var i = 0; i < column; i++) {
            if (Math.random() > 0.5) {
                  var str = listText[parseInt(Math.random() * listText.length)];
                  context.fillText(str, i * fontSize, listColumn * fontSize);
                  listColumn += 1;
                  if (listColumn >= row) {
                     listColumn = 0;
                  }
            }
         }
      }

      function resize() {
         canvas.width = window.innerWidth - 3;
         canvas.height = window.innerHeight - 3;

         column = canvas.width / fontSize,
         row = canvas.height / fontSize;

         for (var i = 0; i < column; i++) {
            listColumn = 1;
         }
      }

      window.addEventListener("resize", resize);

      canvas.addEventListener("mousedown", function () {
         clearInterval(timer);
         timer = setInterval(draw, 20);
      });

      canvas.addEventListener("mouseup", function () {
         clearInterval(timer);
         timer = setInterval(draw, 40);
      });

      resize();
      var timer = setInterval(draw, 40);

</script>
</body>
</html>[/mw_shl_code]

admin · 发表于 2014-11-14 18:32:02

喜欢这种感觉

newton2012 · 发表于 2014-12-25 23:44:31

不错不错以前看别人的黑页看过

		自动登录	找回密码
密码			注册[Register]

[CSS/DIV] 黑客帝国：矩阵革命