metanohi-misc-subsites/projects/x/road.htm

90 lines
1.5 KiB
HTML
Raw Normal View History

2011-08-02 19:57:57 +02:00
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3c.org/1999/xhtml">
<head>
<title>Road</title>
<style type='text/css'>
* {
margin:0;
padding:0;
}
body {
position:absolute;
top:50%;
left:50%;
margin-top:-200px;
}
div {
width:10px;
height:10px;
float:left;
top:200px;
position:relative;
background:#000;
}
</style>
<script type='text/javascript'>
len=40
d=document
px="px"
stopped=false
c=0
newtop=new Array()
newtop[0]=200
function road() {
nodetop=200
for (i=0;i<d.body.childNodes.length;i++) {
node=d.body.childNodes[i]
top=node.offsetTop
oldtop=nodetop
if (i==0) {
do {
rand=Math.floor(Math.random()*18+1)
if (rand>9) rand=rand-19
nodetop=top+rand
if (nodetop<0) nodetop=0
} while (nodetop<oldtop-9 || nodetop>oldtop+9)
node.style.top=nodetop+px
newtop[c+1]=new Array()
newtop[c+1][i+1]=nodetop
}
else {
node.style.top=newtop[c][i]+px
newtop[c+1][i+1]=newtop[c][i]
}
}
c=c+1
document.title=c
t=setTimeout("road()",1)
}
function buildroad() {
d.body.style.marginLeft="-"+len*5+"px"
for (i=0; i<len; i++) {
ne=document.createElement("div")
d.body.appendChild(ne)
}
road()
}
function action() {
if (stopped) {
t=setTimeout("road()",1)
stopped=false
document.title="Road"
}
else {
clearTimeout(t)
stopped=true
document.title+=" :: PAUSED"
}
}
window.onload=buildroad
d.onclick=action
</script>
</head>
<body></body>
</html>