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

No:1269

139

←

Prev Next

→

A game where the protagonist is a slime that must ..ALL
Developer User3280｜Date and time 23/6/18 9:33:16
Build time 57.586 sec｜Game capacity 3.564KB｜

Script

Slime Adventure

Ayuda al slime a vencer al giga slime oscuro reclutando a más slimes de distintos tipos. Hay dos finales: uno bueno y otro malo.

Slime normal

Slime de fuego

Slime de agua

Slime eléctrico

Slime de hielo

←

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>Slime Adventure</title>
	<style>
		body {
			background-color: #98FB98;
			text-align: center;
			font-size: 24px;
			font-family: Arial, sans-serif;
			color: #FFF;
		}

h1 {
			font-size: 48px;
			color: #FFF;
		}

.slime {
			display: inline-block;
			margin: 10px;
			cursor: pointer;
		}

.slime img {
			max-width: 100%;
			height: auto;
		}

#start {
			background-color: #FFC125;
			padding: 10px 20px;
			border-radius: 10px;
			border: none;
			font-size: 32px;
			cursor: pointer;
		}

#reset {
			background-color: #FFC125;
			padding: 10px 20px;
			border-radius: 10px;
			border: none;
			font-size: 32px;
			cursor: pointer;
			display: none;
			margin-top: 20px;
		}

#result {
			font-size: 36px;
			margin-top: 20px;
		}
	</style>
</head>
<body>
	<h1>Slime Adventure</h1>
	<p>Ayuda al slime a vencer al giga slime oscuro reclutando a más slimes de distintos tipos. Hay dos finales: uno bueno y otro malo.</p>
	<div id="game">
		<div id="slimes">
			<div class="slime" data-type="normal">
				<img src="https://twemoji.maxcdn.com/2/72x72/1f4a9.png">
				<p>Slime normal</p>
			</div>
			<div class="slime" data-type="fire">
				<img src="https://twemoji.maxcdn.com/2/72x72/1f525.png">
				<p>Slime de fuego</p>
			</div>
			<div class="slime" data-type="water">
				<img src="https://twemoji.maxcdn.com/2/72x72/1f30a.png">
				<p>Slime de agua</p>
			</div>
			<div class="slime" data-type="electric">
				<img src="https://twemoji.maxcdn.com/2/72x72/26a1.png">
				<p>Slime eléctrico</p>
			</div>
			<div class="slime" data-type="ice">
				<img src="https://twemoji.maxcdn.com/2/72x72/2744.png">
				<p>Slime de hielo</p>
			</div>
		</div>
		<button id="start">Empezar</button>
		<button id="reset">Reiniciar</button>
		<div id="result"></div>
	</div>
	<script>
		var slimes = [];

function recruitSlime() {
			var type = this.getAttribute("data-type");
			slimes.push(type);

this.removeEventListener("click", recruitSlime);
			this.classList.add("disabled");
		}

function startGame() {
			var gigaSlime = slimes[Math.floor(Math.random() * slimes.length)];
			var result = document.getElementById("result");

if (gigaSlime == "normal") {
				result.innerHTML = "¡Derrotaste al giga slime oscuro y ganaste el juego!";
			} else {
				result.innerHTML = "El giga slime oscuro era de tipo " + gigaSlime + ". ¡Perdiste!";
			}

document.getElementById("slimes").classList.add("disabled");
			document.getElementById("start").style.display = "none";
			document.getElementById("reset").style.display = "block";
		}

function resetGame() {
			slimes = [];
			var slimesDiv = document.getElementById("slimes");
			slimesDiv.innerHTML = slimesDiv.innerHTML;
			slimesDiv.classList.remove("disabled");
			document.getElementById("start").style.display = "block";
			document.getElementById("reset").style.display = "none";
			document.getElementById("result").innerHTML = "";
			var slimeElements = document.querySelectorAll(".slime");
			for (var i = 0; i < slimeElements.length; i++) {
				slimeElements[i].addEventListener("click", recruitSlime);
				slimeElements[i].classList.remove("disabled");
			}
		}

var slimeElements = document.querySelectorAll(".slime");
		for (var i = 0; i < slimeElements.length; i++) {
			slimeElements[i].addEventListener("click", recruitSlime);
		}
		document.getElementById("start").addEventListener("click", startGame);
		document.getElementById("reset").addEventListener("click", resetGame);
	</script>
</body>
</html>