colors

function Colors(){};

var window_state = {};
var box_size = {
    'w':20,
    'h':20
} 

Colors.prototype = {
    getId:function(id){
	this.c = document.getElementById(id);
    },
    create_canvas:function(){
	var c = document.getElementById('pin');
	var ctx = c.getContext('2d');

	for(var i=0;i<128;i++){
	    for(var j=0;j<127;j++){
		var r = parseInt(Math.random()*255);
		var g = parseInt(Math.random()*255);
		var b = parseInt(Math.random()*255);
		ctx.fillStyle = 'rgb('+r+','+g+','+b+')';
                                ctx.fillRect(j*25,i*25,box_size['w'],box_size['h']);
	    }
	}       
	this.c.appendChild(c);
    },
    w_height:function(){
	this.height = window.innerHeight;
	window_state['height'] = this.height;                
    },
    w_width:function(){
                this.width = window.innerWidth;
	window_state['width'] = this.width;
    },
    arranges:function(){
	//alert(this.width/10);
	//alert(this.height/20);
	return this.width / 10;
    }


};
<html>
<body>
<head>
<title>Colors</title>
<script src="colors.js"></script>
<style type="text/css">
body{
margin:0;
padding:0;
}
</style>
</head>

<div id="colorbox">
<canvas id="pin"  width="1280" height="1300"></canvas>
</div>


<script>

function main(){
  var b = new Colors();
  b.getId('colorbox');
  b.w_height();
  b.w_width();
  b.arranges()
  b.create_canvas();
}


setInterval("main()",1000);
</script>

</body>
</html>

カラフルに繰り返す!
まだ途中だから書きかけのコードも含んでるよ。