|
このスクリプトを使用するには下記のコードと画像（８方向×左右で１６枚）が必要です。
画像はこちらからダウンロードして下さい。画像はスクリプトを貼るページのあるフォルダ内に"frogs"というフォルダを作ってそこにアップロードして下さい。同一ページ内で他のＪａｖａＳｃｒｉｐｔと併用する時にはＩＤなどの競合にご注意下さい。 このスクリプトおよびその付随物はフリーです。個人、商用を問わず、ご自由にご使用ください。ただし、著作権は放棄しません。再配布目的の表示や直接的に利益を得るような場合は事前にお問い合わせください。また、作者は一切の責任を負いません。無保証です。・・・って硬いこと書きましたが、Feel free〜♥ ってことで。(^^)
<HTML>
<HEAD>
…
<SCRIPT Language="JavaScript" type="text/javascript">
<!--
var MoveMode = 0;
var Steps = 20;
var Speed = 200;
var RorL = 0;
var FrogX = -80;
var FrogY = -80;
var dX = 1;
var dY = 1;
var dN = 4;
var dT = 1;
var dL = 10;
var OldFrog = 6;
var NewFrog = 0;
function moveFrog(){
if(Steps<=0){
MoveMode+=1;
if(Math.random()<0.5)MoveMode+=1;
if(MoveMode>2)MoveMode-=3;
switch(MoveMode){
case 0:
Steps=3+7*Math.random();
Speed=100+600*Math.random()*Math.random();
break;
case 1:
Steps=2;
Speed=1000+9000*Math.random()*Math.random()*Math.random();
break;
default:
Steps=3*Math.random();
dT=-1;
if(Math.random()<0.5)dT=1;
Speed=200+200*Math.random()*Math.random();
}
}
Steps-=1;
if(MoveMode==1){
if(Steps!=0)return;
if((300-FrogX)*dX>=0&&(300-FrogY)*dY>=0){
Speed=1000;
dL=140;
if(dX==0||dY==0)dL=200;
FrogX += dX * dL;
FrogY += dY * dL;
return;
}
return;
}
if(MoveMode==2){
dN+=dT;
if(dN==0)dN=8;
if(dN==9)dN=1;
switch(dN){
case 1:
dX=0;
dY=-1;
break;
case 2:
dX=1;
dY=-1;
break;
case 3:
dX=1;
dY=0;
break;
case 4:
dX=1;
dY=1;
break;
case 5:
dX=0;
dY=1;
break;
case 6:
dX=-1;
dY=1;
break;
case 7:
dX=-1;
dY=0;
break;
case 8:
dX=-1;
dY=-1;
}
}
if(MoveMode==0){
dL=10;
if(dX==0||dY==0)dL=15;
if(FrogX<-30&&dX==-1){
Steps=3;
MoveMode=2;
Speed=200;
}
if(FrogX>600&&dX==1){
Steps=5;
MoveMode=2;
Speed=200;
}
if(FrogY<-30&&dY==-1){
Steps=3;
MoveMode=2;
Speed=200;
}
if(FrogY>600&&dY==1){
Steps=5;
MoveMode=2;
Speed=200;
}
dL=10;
if(dX==0||dY==0)dL=15;
FrogX += dX * dL;
FrogY += dY * dL;
}
if(RorL==1)RorL=0;
else RorL=1;
}
function draw(){
NewFrog=(dN-1)*2+RorL;
if (document.getElementById){
document.getElementById("frog"+OldFrog).style.top = -80;
document.getElementById("frog"+NewFrog).style.left = FrogX;
document.getElementById("frog"+NewFrog).style.top = FrogY;
}
if (document.all){
document.all("frog"+OldFrog).style.top = -80;
document.all("frog"+NewFrog).style.left = FrogX;
document.all("frog"+NewFrog).style.top = FrogY;
}
if (document.layers){
document.layers["frog"+OldFrog].top = -80;
document.layers["frog"+NewFrog].left = FrogX;
document.layers["frog"+NewFrog].top = FrogY;
}
OldFrog=NewFrog;
}
function main(){
moveFrog();
draw();
clearTimeout(timerID);
timerID = setTimeout("main()",Speed);
}
// -->
</SCRIPT>
…
</HEAD>
<BODY>
…
<DIV ID="frog0" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog10.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog1" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog11.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog2" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog20.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog3" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog21.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog4" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog30.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog5" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog31.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog6" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog40.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog7" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog41.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog8" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog50.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog9" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog51.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog10" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog60.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog11" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog61.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog12" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog70.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog13" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog71.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog14" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog80.gif" alt="" width="80" height="80">
</DIV>
<DIV ID="frog15" STYLE="position:absolute;top:-80px;">
<IMG SRC="frogs/frog81.gif" alt="" width="80" height="80">
</DIV>
<script Language="JavaScript" type="text/javascript">
<!--
timerID = setTimeout("main()",Speed);
// -->
</script>
</BODY>
</HTML>
|
