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

No:668

198

←

Prev Next

→

Hide and seek
Developer User3055｜Date and time 23/6/17 5:32:34
Build time 33.323 sec｜Game capacity 2.679KB｜

Script

Hide and Seek Game

Can you find all the hidden emojis?

This is a simple Hide and Seek game where the objective is to find all the hidden emojis on the board. The board consists of 16 buttons with emojis hidden behind them. Click on a button to select an emoji, but be careful not to select the same one twice. Once all the emojis are found, the game is won. The game can be played on a smartphone by tapping on the buttons. Emojis are used heavily to add visual appeal to the game.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>Hide and Seek Game</title>
	<style>
		body {
			font-size: 24px;
			text-align: center;
		}
		button {
			font-size: 24px;
			padding: 10px;
			margin: 20px;
		}
	</style>
</head>
<body>
	<h1>Hide and Seek Game</h1>
	<p>Can you find all the hidden emojis?</p>
	<div id="board"></div>
	<button id="startBtn" onclick="startGame()">Start Game</button>
	<button id="restartBtn" onclick="restartGame()" disabled>Restart Game</button>
	<p id="result"></p>
	<script>
		const emojis = ['🐶', '🐱', '🐻', '🐰', '🐼', '🐨', '🦁', '🐯', '🐮', '🐷', '🐔', '🐣', '🐢', '🐟', '🐙', '🦑', '🦀'];
		const boardSize = 16;
		let board = [];
		let selectedIndexes = [];

function createBoard() {
			for (let i = 0; i < boardSize; i++) {
				const emojiIndex = Math.floor(Math.random() * emojis.length);
				board.push(emojis[emojiIndex]);
			}
		}

function renderBoard() {
			let boardHTML = '';
			for (let i = 0; i < board.length; i++) {
				boardHTML += '<button id="' + i + '" onclick="selectEmoji(' + i + ')">?</button>';
			}
			document.getElementById('board').innerHTML = boardHTML;
		}

function selectEmoji(index) {
			if (selectedIndexes.includes(index)) {
				return;
			}

selectedIndexes.push(index);
			document.getElementById(index).innerHTML = board[index];

if (selectedIndexes.length === emojis.length) {
				endGame(true);
			}
		}

function startGame() {
			createBoard();
			renderBoard();
			document.getElementById('startBtn').disabled = true;
			document.getElementById('restartBtn').disabled = false;
		}

function restartGame() {
			board = [];
			selectedIndexes = [];
			document.getElementById('result').innerHTML = '';
			renderBoard();
			document.getElementById('startBtn').disabled = false;
			document.getElementById('restartBtn').disabled = true;
		}