Rotate ♻️ sushi🍣game🎮butter🧈 to destroy💥! ❗️'s game

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

No:3130

6169

←

Prev Next

→

Rotate ♻️ sushi🍣game🎮butter🧈 to destroy💥! ❗️
Developer User3589｜Date and time 23/6/23 22:47:40
Build time 27.144 sec｜Game capacity 2.634KB｜

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>回転寿司ゲーム</title>
	<style>
		body {
			margin: 0;
			padding: 0;
			background-color: #333;
		}

#game {
			position: relative;
			width: 100vw;
			height: 100vh;
		}

#castle {
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			width: 200px;
			height: 200px;
			background-image: url('https://cdn.pixabay.com/photo/2015/12/07/12/04/castle-1080540_960_720.png');
			background-size: cover;
		}

.sushi {
			position: absolute;
			width: 50px;
			height: 50px;
			background-image: url('https://cdn.pixabay.com/photo/2016/08/21/14/22/sushi-1618259_960_720.png');
			background-size: cover;
			cursor: pointer;
		}

.butter {
			position: absolute;
			width: 50px;
			height: 50px;
			background-image: url('https://cdn.pixabay.com/photo/2017/09/21/16/19/butter-2775436_960_720.png');
			background-size: cover;
			cursor: pointer;
		}

@keyframes spin {
			from {
				transform: rotate(0deg);
			}
			to {
				transform: rotate(360deg);
			}
		}
	</style>
</head>
<body>
	<div id="game">
		<div id="castle"></div>
	</div>

function createSushi() {
			const sushi = document.createElement('div');
			sushi.classList.add('sushi');
			sushi.style.top = Math.random() * game.offsetHeight + 'px';
			sushi.style.left = Math.random() * game.offsetWidth + 'px';
			sushi.addEventListener('click', () => {
				score++;
				updateScore();
				game.removeChild(sushi);
			});
			game.appendChild(sushi);
		}

function createButter() {
			const butter = document.createElement('div');
			butter.classList.add('butter');
			butter.style.top = Math.random() * game.offsetHeight + 'px';
			butter.style.left = Math.random() * game.offsetWidth + 'px';
			butter.addEventListener('click', () => {
				score -= 5;
				updateScore();
				game.removeChild(butter);
			});
			game.appendChild(butter);
		}

function updateScore() {
			castle.innerHTML = `スコア: ${score}`;
		}

setInterval(createSushi, 1000);
		setInterval(createButter, 5000);

castle.addEventListener('click', () => {
			if (score >= 50) {
				alert('おめでとう！お城を守りきった！');
			} else {
				alert('お城はまだ危険だ！がんばれ！');
			}
		});

game.addEventListener('click', () => {
			game.style.animation = 'spin 1s linear infinite';
		});
	</script>
</body>
</html>