スクアプデしない開発者ひさしを虐めるゲーム

😡

👋

🦶

何度でも叩けます！

このアプリは、3つの要素にそれぞれクリックした回数を表示するだけのシンプルなゲームです。絵文字を多めに使っています。プレイヤーは「😡」「👋」「🦶」のいずれかをクリックして開発者ひさしを虐めることができます。何度でも叩けるため、ストレス発散にもなります。スマホでの操作も前提になっています。

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
	<title>スクアプデしない開発者ひさしを虐めるゲーム</title>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style type="text/css">
		body {
			margin: 0;
			padding: 0;
			text-align: center;
			background-color: #efefef;
			font-family: Arial, sans-serif;
		}

#game-container {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			align-items: center;
			height: 80vh;
		}

#game-container div {
			cursor: pointer;
			margin: 10px;
			padding: 20px;
			border-radius: 50%;
			box-shadow: 2px 2px 10px #888888;
			transition: all 0.3s ease-in-out;
		}

#game-container div:hover {
			transform: scale(1.2);
			box-shadow: 5px 5px 20px #888888;
		}

#game-container img {
			width: 100px;
			height: 100px;
		}

h1 {
			margin-top: 50px;
			font-size: 2rem;
			color: #444444;
		}

p {
			margin-top: 10px;
			font-size: 1.2rem;
			color: #666666;
		}
	</style>
</head>
<body>
	<h1>スクアプデしない開発者ひさしを虐めるゲーム</h1>
	<div id="game-container">
		<div id="click-me" onclick="punch()">😡</div>
		<div id="slap-me" onclick="slap()">👋</div>
		<div id="kick-me" onclick="kick()">🦶</div>
	</div>
	<p>何度でも叩けます！</p>
	<script type="text/javascript">
		let score = 0;
		const clickMe = document.getElementById('click-me');
		const slapMe = document.getElementById('slap-me');
		const kickMe = document.getElementById('kick-me');

function punch() {
			score++;
			updateScore();
		}

function slap() {
			score++;
			updateScore();
		}

function kick() {
			score++;
			updateScore();
		}

function updateScore() {
			clickMe.innerHTML = `😡 ${score}`;
			slapMe.innerHTML = `👋 ${score}`;
			kickMe.innerHTML = `🦶 ${score}`;
		}
	</script>
</body>
</html>