WEST MiRa(1,739 Byte)
JavaScript(1,601 Byte)
jbZ

■ JavaScript - サンプル集(257種類) - ゲーム
   - スロットゲーム Ver5

画像版のスロットゲームです。
コインが揃ったり連番になると、コインを獲得できます。
リセットを押すと初期状態に返ります。
コインがゼロになると、その旨伝えるダイアログが出ます。

サンプルを見る
ソースを保存する
(右クリック→「対象をファイルに保存」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;
				document.form1.kekka.value=kekka;

				winner();
				}
			}
		}


	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';
			}
		tmp = 0;
		clearTimeout(tmp);
		tmp = 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ファイルがあるディレクトリと、同じディレクトリに保存して下さい。

初期コインの枚数や倍率を変更したい方は、ソース内の注釈を参考に色々と指定してみて下さい。


バナー、リンクについて  ,   利用規約  ,   ヘルプ

Copyright (C) 1998-2007 WEST MiRa. All rights reserved.