Roboyan(自作ロボット1号)
Sample Source......................................................................>>>
<script language="JavaScript"><!--
var timer1,timer2,timer3,timer4;
function RoboMove1(){
hnl.style.top = 145;
hnl.style.left = 30;
hnl.style.width = 100;
hnl.style.height = 20;
hnr.style.top = 145;
hnr.style.left = 270;
hnr.style.width = 100;
hnr.style.height = 20;
shl.style.top = 135;
shr.style.top = 135;
fac.style.top = 60;
kub.style.top = 130;
by.style.top = 140;
ftl.style.left = 140;
ftr.style.left = 240;
timer1 = setTimeout("RoboMove2()",1000);
}
function RoboMove2(){
hnl.style.top = 125;
hnl.style.left = 110;
hnl.style.width = 20;
hnl.style.height = 100;
hnr.style.top = 125;
hnr.style.left = 270;
hnr.style.width = 20;
hnr.style.height = 100;
shl.style.top = 205;
shr.style.top = 205;
fac.style.top = 130;
fac.style.backgroundColor = "red";
kub.style.top = 200;
kub.style.backgroundColor = "red";
by.style.top = 210;
ffl.style.visibility = "visible";
ffr.style.visibility = "visible";
ftl.style.left = 105;
ftl.style.top = 340;
ftl.style.width = 15;
ftl.style.height = 60;
ftr.style.left = 280;
ftr.style.top = 340;
ftr.style.width = 15;
ftr.style.height = 60;
timer2 = setTimeout("RoboMove3()",1000);
}
function RoboMove3(){
hnl.style.top = 145;
hnl.style.left = 30;
hnl.style.width = 100;
hnl.style.height = 20;
hnr.style.top = 145;
hnr.style.left = 270;
hnr.style.width = 100;
hnr.style.height = 20;
shl.style.top = 135;
shr.style.top = 135;
fac.style.top = 60;
fac.style.backgroundColor = "salmon";
kub.style.top = 130;
kub.style.backgroundColor = "salmon";
by.style.top = 140;
ffl.style.visibility = "hidden";
ffr.style.visibility = "hidden";
ftl.style.top = 250;
ftl.style.left = 140;
ftl.style.width = 20;
ftl.style.height = 150;
ftr.style.top = 250;
ftr.style.left = 240;
ftr.style.width = 20;
ftr.style.height = 150;
timer3 = setTimeout("RoboMove4()",1000);
}
function RoboMove4(){
hnl.style.top = 0;
hnl.style.left = 130;
hnl.style.width = 20;
hnl.style.height = 95;
hnr.style.top = 0;
hnr.style.left = 250;
hnr.style.width = 20;
hnr.style.height = 95;
shl.style.top = 95;
shr.style.top = 95;
fac.style.top = 20;
kub.style.top = 90;
by.style.top = 100;
ftl.style.left = 160;
ftr.style.left = 220;
timer4 = setTimeout("RoboMove1()",1000);
}
function Stop(){
clearTimeout(timer1);
clearTimeout(timer2);
clearTimeout(timer3);
clearTimeout(timer4);
}
</script>
</head>
<body>
<div style="position:absolute;top:50;left:100;width:400;height:400">
<div id="hnl" style="position:absolute;top:0;left:130;
width:20;height:95;background-color:pink"></div>
<div id="hnr" style="position:absolute;top:0;left:250;
width:20;height:95;background-color:pink"></div>
<div id="shl" style="position:absolute;top:95;left:130;
width:30;height:40;background-color:green"></div>
<div id="shr" style="position:absolute;top:95;left:240;
width:30;height:40;background-color:green"></div>
<div id="fac" style="position:absolute;top:20;left:175;
width:50;height:70;background-color:salmon"></div>
<div id="kub" style="position:absolute;top:90;left:180;
width:40;height:10;background-color:salmon"></div>
<div id="by" style="position:absolute;top:100;left:160;
width:80;height:150;background-color:green"></div>
<div id="ffl" style="position:absolute;top:320;left:120;
width:40;height:50;background-color:green;visibility:hidden"></div>
<div id="ffr" style="position:absolute;top:320;left:240;
width:40;height:50;background-color:green;visibility:hidden"></div>
<div id="ftl" style="position:absolute;top:250;left:160;
width:20;height:150;background-color:pink"></div>
<div id="ftr" style="position:absolute;top:250;left:220;
width:20;height:150;background-color:pink"></div>
</div>
<button onclick="RoboMove1();">体操始め！</button>
<button onclick="Stop();">お休み!</button>
end(最終更新:12/11/6)