Make a turn-based RPG in which you use many weapons to defeat monsters that appear one after another. When you reduce their HP to exactly zero, you can act again.'s game

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

No:1903

200

←

Prev Next

→

Make a turn-based RPG in which you use many weapon..ALL
Developer User3186｜Date and time 23/6/19 13:44:32
Build time 23.795 sec｜Game capacity 3.222KB｜

Script

👹

←

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>モンスター討伐RPG</title>
	<style>
		body {
			text-align: center;
			font-size: 30px;
			margin-top: 50px;
			font-family: sans-serif;
		}

button {
			background-color: #f44336;
			color: white;
			padding: 20px 40px;
			font-size: 20px;
			border: none;
			cursor: pointer;
			border-radius: 5px;
			margin: 0 10px;
		}

button:hover {
			background-color: #ff6659;
		}

#message {
			font-size: 20px;
			font-weight: bold;
			margin-bottom: 20px;
		}

#monster {
			font-size: 50px;
			margin-bottom: 20px;
		}

#health-bar {
			background-color: #ddd;
			height: 30px;
			width: 90%;
			border-radius: 5px;
			margin: 0 auto;
			overflow: hidden;
		}

#health {
			background-color: #f44336;
			height: 100%;
			width: 100%;
			padding: 5px;
			box-sizing: border-box;
			color: white;
			text-align: center;
			font-size: 20px;
			font-weight: bold;
		}
	</style>
</head>
<body>
	<div id="message"></div>
	<div id="monster">👹</div>
	<div id="health-bar">
		<div id="health"></div>
	</div>
	<button onclick="attack()">攻撃する</button>
	<button onclick="useItem()">アイテムを使う</button>
	<button onclick="runAway()">逃げる</button>

let player = {
			name: "勇者",
			maxHealth: 100,
			currentHealth: 100,
			inventory: [
				{
					name: "剣",
					damage: 20
				},
				{
					name: "魔法の杖",
					damage: 30
				},
				{
					name: "回復薬",
					effect: 40
				}
			]
		};

updateHealth();

function attack() {
			let weapon = player.inventory[0];
			let damage = weapon.damage;
			monster.currentHealth -= damage;

if (monster.currentHealth <= 0) {
				monster.currentHealth = 0;
				updateHealth();
				endGame("やった！モンスターを倒した！");
			} else {
				let monsterDamage = Math.floor(Math.random() * 10) + 10;
				player.currentHealth -= monsterDamage;

if (player.currentHealth <= 0) {
					player.currentHealth = 0;
					updateHealth();
					endGame("負けちゃった...");
				} else {
					updateHealth();
					let message = "モンスターに" + damage + "のダメージ！\n";
					message += "勇者は" + monsterDamage + "のダメージを受けた...";
					displayMessage(message);
				}
			}
		}

function useItem() {
			let item = player.inventory[2].effect;
			player.currentHealth += item;

if (player.currentHealth > player.maxHealth) {
				player.currentHealth = player.maxHealth;
			}

updateHealth();
			displayMessage("回復薬を使って体力を回復した！");
		}

function runAway() {
			displayMessage("勇者は逃げ出した...");
			endGame("また挑戦しましょう！");
		}

function updateHealth() {
			document.getElementById("health").innerHTML = player.currentHealth + "/" + player.maxHealth;
			document.getElementById("health").style.width = (player.currentHealth / player.maxHealth) * 100 + "%";
		}

function displayMessage(message) {
			document.getElementById("message").innerHTML = message;
		}

function endGame(message) {
			alert(message);
			location.reload();
		}
	</script>
</body>
</html>