var e = document.getElementById('out').style; var left = 0; var height = 0; var id = setInterval(moveBox, 20); var color = new Array(4); color[0] = '#ffffff'; color[1] = '#000000'; color[2] = '#ff0000'; color[3] = '#00ff00';
function moveBox() { var index = Math.round(color.length*Math.random()) left += 4; height += 2; e.left = left + 'px'; e.height = height + 'px'; e.width = 10*Math.random() + 'px'; e.top = 10*Math.random() + 'px'; e.background = color[index]; if (left >= 400) clearInterval(id); }
1 件のコメント:
evalの間隔を短くして常に実行し続けながらコーディングするのも楽しい。意味が解釈された瞬間divが動き出す。エラーを吐いてそれも視覚要素にしようかな。あと最初の変数をこうすれば割と楽に書けることが判明。
var e = document.getElementById('out').style;
var left = 0;
var height = 0;
var id = setInterval(moveBox, 20);
var color = new Array(4);
color[0] = '#ffffff';
color[1] = '#000000';
color[2] = '#ff0000';
color[3] = '#00ff00';
function moveBox() {
var index = Math.round(color.length*Math.random())
left += 4;
height += 2;
e.left = left + 'px';
e.height = height + 'px';
e.width = 10*Math.random() + 'px';
e.top = 10*Math.random() + 'px';
e.background = color[index];
if (left >= 400) clearInterval(id);
}
コメントを投稿