画像版のスロットゲームです。
コインが揃ったり連番になると、コインを獲得できます。
リセットを押すと初期状態に返ります。
コインがゼロになると、その旨伝えるダイアログが出ます。
・サンプルを見る
・ソースを保存する
（右クリック→「対象をファイルに保存」or「リンクを名前を付けて保存」して下さい。）
・ソースを見る
・解説を見る
[ ソース ]
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=Shift_JIS">
<script language="JavaScript"><!--//
//=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=//
//= =//
//= Copyright (C) 1998-2007 WEST MiRa. All rights reserved. =//
//= WEST MiRa http://www.west-mira.jp/ =//
//= =//
//=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=*=//
hatena=new Image();
//ゲーム開始時のはてなマークの画像を指定
hatena.src="hatena.gif";
//画像の横幅を指定
pic_w=50;
//画像の高さを指定
pic_h=50;
//初期状態のコインの枚数を指定する
coin=50;
//スロットが回る早さを指定する
hayasa=30;
//ぞろ目時の賞金の倍率を指定する
//2だったら揃った数の2倍、3だったら揃った数の3倍
rate1=2;
//連番時の賞金の倍率を指定する
//2だったら揃った数の2倍、3だったら揃った数の3倍
rate2=3;
//コインを使い果たした時のメッセージを指定する
mes='手持ちコインがありません...';
//メッセージ欄の背景色を指定
mes_bgcolor='#fbdcae';
//メッセージ欄の文字色を指定
mes_fontcolor='#000000';
//メッセージ欄の横幅を指定
mes_w=280;
//センター表示チェック。1ならセンター表示、0なら指定位置優先
cen_han=1;
//表示位置
x_iti=300;
y_iti=50;
//メッセージ欄が消えるまでの秒数
mes_time=3;
kekka=coin;
moji='';
nums=new Array('','','');
timers=0; time_win=0;
e1=0;e2=0;e3=0;
pic=new Array();
function hajime()
{
if(cen_han == 1)
{
if((document.layers) || ((document.getElementById) && (!document.all)))
{
x_iti=(outerWidth-mes_w)/2;
}
else
{
x_iti=(document.body.clientWidth-mes_w)/2;
}
}
for(i = 0; i < 10; i++)
{
pic[i]=new Image();
pic[i].src=""+i+".gif";
document.images["hidden"].src=pic[i].src;
}
document.images["hidden"].src=hatena.src;
kekka=coin;
document.form1.kekka.value=coin;
document.images["pic"+0].src=hatena.src;
document.images["pic"+1].src=hatena.src;
document.images["pic"+2].src=hatena.src;
}
function srot()
{
if(e1 < 1000)
{
nums[0]=Math.floor(Math.random()*46);
for(i1=0 , j1=9 , k1=j1; i1 < 10; i1++)
{
if(nums[0] < k1 || nums[0] == 45)
{
if(i1+1 == 10)nums[0]=0;
else nums[0]=i1+1;
break;
}
j1--;
k1+=j1;
}
document.images["pic"+0].src=pic[nums[0]].src;
e1++;
clearTimeout(timers);
timers=setTimeout('srot()',hayasa);
}
if(e2 < 1000)
{
nums[1]=Math.floor(Math.random()*46);
for(i2=0,j2=9,k2=j2; i2 < 10; i2++)
{
if(nums[1] < k2 || nums[1] == 45)
{
if(i2+1 == 10)nums[1]=0;
else nums[1]=i2+1;
break;
}
j2--;
k2+=j2;
}
document.images["pic"+1].src=pic[nums[1]].src;
e2++;
clearTimeout(timers);
timers=setTimeout('srot()',hayasa);
}
if(e3 < 1000)
{
nums[2]=Math.floor(Math.random()*46);
for(i3=0,j3=9,k3=j3; i3 < 10; i3++)
{
if(nums[2] < k3 || nums[2] == 45)
{
if(i3+1 == 10)nums[2]=0;
else nums[2]=i3+1;
break;
}
j3--;
k3+=j3;
}
document.images["pic"+2].src=pic[nums[2]].src;
e3++;
clearTimeout(timers);
timers=setTimeout('srot()',hayasa);
}
if(e1 >= 1000)stop();
else if(e2 >= 1000)stop();
else if(e3 >= 1000)stop();
}
function stop()
{
document.images["pic"+0].src=pic[nums[0]].src;
document.images["pic"+1].src=pic[nums[1]].src;
document.images["pic"+2].src=pic[nums[2]].src;
kekka_moji='';
if(e1 >= 1000 && e2 >= 1000 && e3 >= 1000)
{
tmp = 0;
if(nums[0] == nums[1] && nums[1] == nums[2])
{
if(nums[0] == 0)tmp+=10*rate1;
else tmp+=nums[0]*rate1;
kekka_moji+=nums[0]+''+nums[1]+''+nums[2]+'<br>';
}
else if(nums[0] == nums[1]+1 && nums[1] == nums[2]+1)
{
if(nums[0] == 0)tmp+=10*rate2;
else tmp+=nums[0]*rate2;
kekka_moji+=nums[0]+''+nums[1]+''+nums[2]+'<br>';
}
else if(nums[2] == nums[1]+1 && nums[1] == nums[0]+1)
{
if(nums[0] == 0)tmp+=10*rate2;
else tmp+=nums[0]*rate2;
kekka_moji+=nums[2]+''+nums[1]+''+nums[0]+'<br>';
}
if(kekka_moji != '')
{
moji='<strong>You Win！<\/strong><br><br>';
moji+=kekka_moji+'<br>おめでとうございます！<br>貴方は'+tmp+'枚コインを獲得しました。<br>';
kekka += tmp;
winner();
}
document.form1.kekka.value=kekka;
}
}
function winner()
{
kazari='<table width="'+mes_w+'" bgcolor="'+mes_bgcolor+'" cellpadding="4" cellspacing="0" border="0"><tr align="center"><td>';
kazari+='<br><br><font color="'+mes_fontcolor+'">';
kazari2='<br><br><\/font><\/td><\/tr><\/table>';
if(document.layers)
{
document.layers["lay0"].moveTo(x_iti,y_iti);
document.layers["lay0"].document.open();
document.layers["lay0"].document.write(kazari+moji+kazari2);
document.layers["lay0"].document.close();
document.layers["lay0"].visibility='show';
}
else if((document.getElementById) && (!document.all))
{
document.getElementById("lay0").style.top=y_iti;
document.getElementById("lay0").innerHTML=kazari+moji+kazari2;
document.getElementById("lay0").style.visibility='visible';
}
else if(document.all)
{
document.all("lay0").style.pixelLeft=x_iti;
document.all("lay0").style.pixelTop=y_iti;
document.all("lay0").innerHTML=kazari+moji+kazari2;
document.all("lay0").style.visibility='visible';
}
clearTimeout(time_win);
time_win=setTimeout('layer_kakusu()',mes_time*1000);
}
function layer_kakusu()
{
if(document.layers)
document.layers["lay0"].visibility="hidden";
else if((document.getElementById) && (!document.all))
document.getElementById("lay0").style.visibility="hidden";
else if(document.all)
document.all("lay0").style.visibility="hidden";
return;
}
function starts(e)
{
e=eval(e);
if(e == 0)
{
if(kekka<1)
{
moji='<strong>Game Over...<\/strong><br><br>';
moji+=mes+'<br><br>';
moji+='もう一度挑戦するには、<br>Resetボタンを押して下さい。<br><br>';
winner();
document.form1.kekka.value=0;
document.form1.kekka.value=0;
}
else
{
kekka--;
document.form1.kekka.value=kekka;
e1=0;e2=0;e3=0;
srot();
}
}
else if(e == 1)e1=1000;
else if(e == 2)e2=1000;
else if(e == 3)e3=1000;
}
//-->
</script>
</head>
<body onLoad="hajime();">
<!-- 以下変更不可 -->
<span id="lay0" style="position:absolute;visibility:hidden;"></span>
<img src="dummy.gif" name="hidden" width="1" height="1" border="0">
<table border="1" align="center">
<tr align="center">
<script language="JavaScript" type="text/javascript">
<!--//Copyright (C) WEST MiRa http://www.west-mira.jp
for(i = 0; i < 3; i++)
{
document.write('<td><img src="'+hatena.src+'" name="pic'+i+'" border="0" width="'+pic_w+'" height="'+pic_h+'">');
document.write('<br><br><input type="button" value="Stop!" onClick="starts('+(i+1)+');"><\/td>');
}
//-->
</script>
</tr>
<tr><td colspan="3" align="center"><br>
<form name="form1">
<input type="button" value="Start!" onClick="starts(0);">
<input type="button" value="Reset" onClick="hajime();"><br><br>
手持ちコインはあと<input type="text" size="3" name="kekka">枚。
</form>
</td></tr></table>
<!-- 以上変更不可 -->
</div>
</body></html>
[ 解説 ]
まず最初にデフォルトで表示させる画像と、スロットに表示する画像を用意します。
デフォルトの画像は1つで結構です。
名前もお好きなものを付けて下さい。
スロットに表示する画像ですが、これも必ずデフォルトの画像と同じサイズで作ってください。
名前は必ず0から9までの数字を割り振ってください。
どのような画像を使っても良いのですが、名前は「0.gif」や「1.gif」にして下さい。
それぞれの画像の名前は
「0.gif , 1.gif , 2.gif , 3.gif , 4.gif , 5.gif , 6.gif , 7.gif , 8.gif , 9.gif」
になります。
また、スロットゲームのHTMLファイルがあるディレクトリと、同じディレクトリに保存して下さい。
初期コインの枚数や倍率を変更したい方は、ソース内の注釈を参考に色々と指定してみて下さい。
|
