demon who attracts wanderers and travellers's game

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

No:3140

2722

←

Prev Next

→

demon who attracts wanderers and travellers
Developer User3660｜Date and time 23/6/23 23:27:32
Build time 34.382 sec｜Game capacity 3.123KB｜

Script

の呪いから村を救う冒険ゲームを作りました！

ゲームオーバー

プレイヤーは黄色い正方形で、マウスの動きに合わせて移動します。村人は緑色の正方形で、クリックすることで救えます。しかし、タタリ神の呪いにかかった村人もいるため、プレイヤーが村人に接触するとゲームオーバーです。全ての村人を救うと、ゲームクリアです。スマホでも遊べるように画面サイズに対応しています。楽しんで遊んでください！

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

の呪いから村を救う冒険ゲームを作りました！

<!DOCTYPE html>
<html>
<head>
	<title>タタリ神の呪いから村を救え！</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		#container {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			align-items: center;
			height: 100vh;
		}

.box {
			width: 100px;
			height: 100px;
			background-color: green;
			margin: 10px;
			cursor: pointer;
		}

#player {
			width: 30px;
			height: 30px;
			background-color: yellow;
			position: absolute;
			top: 0;
			left: 0;
		}

#villagers {
			display: none;
		}

#game-over {
			position: fixed;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			font-size: 3em;
			color: red;
			display: none;
		}
	</style>
</head>
<body>
	<div id="container"></div>
	<div id="player"></div>
	<div id="villagers">
		<div class="box"></div>
		<div class="box"></div>
		<div class="box"></div>
		<div class="box"></div>
		<div class="box"></div>
	</div>
	<div id="game-over">ゲームオーバー</div>

container.addEventListener('mousemove', function(e) {
			player.style.top = e.clientY + 'px';
			player.style.left = e.clientX + 'px';
			checkCollision();
		});