Click here for free DL of the app version that can save data.

No:2477

137

←

Prev Next

→

10-reel slot machine
Developer anonymous｜Date and time 23/6/21 16:24:06
Build time 28.234 sec｜Game capacity 2.048KB｜

Script

10 Reel Slot Machine

このアプリは、10個のリールを持つスロットマシンです。スマホで操作することが前提で、ボタンをタップするとリールがスピンし、リール1つ1つにランダムな絵文字が表示されます。スロットマシンのようなゲームで、楽しんで遊べるアプリです。また、絵文字を多めに使用し、親しみやすさを意識しています。

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームアプリランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
	<title>10 Reel Slot Machine</title>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		body {
			background-color: #F0F8FF;
			font-size: 2em;
			text-align: center;
		}
		button {
			margin: 10px;
			padding: 10px;
			font-size: 1em;
			border-radius: 20px;
			background-color: #87CEEB;
			color: white;
			border: none;
			box-shadow: 0px 0px 10px #708090;
			cursor: pointer;
		}
		#reel {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			margin-top: 50px;
		}
		.slot {
			margin: 10px;
			width: 100px;
			height: 100px;
			font-size: 4em;
			background-color: #FFDAB9;
			border-radius: 20px;
			box-shadow: 0px 0px 10px #708090;
			line-height: 90px;
			text-align: center;
		}
		h1 {
			font-size: 3em;
			margin-top: 50px;
			color: #87CEEB;
		}
	</style>
</head>
<body>
	<h1>10 Reel Slot Machine</h1>
	<div id="reel">
		<div class="slot"></div>
		<div class="slot"></div>
		<div class="slot"></div>
		<div class="slot"></div>
		<div class="slot"></div>
		<div class="slot"></div>
		<div class="slot"></div>
		<div class="slot"></div>
		<div class="slot"></div>
		<div class="slot"></div>
	</div>
	<button onclick="spin()">Spin</button>
	<script>
		let reel = document.querySelectorAll('.slot');
		let emojis = ['😀', '🎉', '💰', '👑', '🍀', '🎲'];
		
		function spin() {
			let randomNum = Math.floor(Math.random() * emojis.length);
			for (let i = 0; i < reel.length; i++) {
				setTimeout(() => {
					reel[i].innerHTML = emojis[randomNum];
				}, 200 * i);
			}
		}
	</script>
</body>
</html>