ANTON072
1/14/2015 - 4:06 PM

canvas rain http://bl.ocks.org/ANTON072/raw/e72b42cc7a4906f2a5d6/

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Document</title>
  <style>
    * {
      margin: 0;
      padding: 0;
    }
    html, body {
      width: 100%;
      height: 100%;
    }
  </style>
</head>
<body>

<canvas id="canvas"></canvas>

<script>
  var canvas = document.getElementById('canvas');
  var context = canvas.getContext('2d');
  canvas.width = window.innerWidth;
  canvas.height = window.innerHeight;

  (function tick() {
    window.setTimeout(tick, 1000 / 12);
//    window.requestAnimationFrame(tick);
    canvas.width = window.innerWidth;
    canvas.height = window.innerHeight;
    var randomBlue = Math.floor(Math.random() * 10);
    for (var i = 0.5; i < canvas.width; i+=15) {
      context.moveTo(i, Math.floor(Math.random() * canvas.height));
      context.lineTo(i, Math.floor(Math.random() * canvas.height));
    }
    context.fillStyle = '#191919';
    context.fillRect(0, 0, canvas.width, canvas.height);
    context.strokeStyle = '#33669' + randomBlue;
    context.stroke();
  }());

</script>
</body>
</html>