スクアプデをお仕置きしよう！

開発者ひさしはアプデを放置しています。あなたはプレイヤーとして開発者ひさしをお仕置きするために、拳で殴ったり、蹴ったり、叩いたりしてスコアを稼ぎましょう！

スコア: 0

※このコードは、オンラインエディタ上で動作確認をしております。一部スタイルが適用されていない場合があります。

←

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 {
			background-color: #feb2b2;
			font-family: Arial, sans-serif;
			text-align: center;
		}
		h1 {
			font-size: 3rem;
			margin-top: 2rem;
		}
		p {
			font-size: 2rem;
			margin: 2rem;
		}
		.button {
			background-color: #4CAF50;
			border: none;
			color: white;
			padding: 1rem 2rem;
			text-align: center;
			text-decoration: none;
			display: inline-block;
			font-size: 2rem;
			margin: 2rem;
			cursor: pointer;
			border-radius: 1rem;
			box-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
		}
		.button:hover {
			background-color: #3e8e41;
		}
		.wrapper {
			display: flex;
			flex-direction: column;
			justify-content: space-around;
			height: 100%;
			align-items: center;
			text-align: center;
		}
	</style>
</head>
<body>
	<div class="wrapper">
		<h1>スクアプデをお仕置きしよう！</h1>
		<p>開発者ひさしはアプデを放置しています。あなたはプレイヤーとして開発者ひさしをお仕置きするために、拳で殴ったり、蹴ったり、叩いたりしてスコアを稼ぎましょう！</p>
		<button onClick="hit()">殴る</button>
		<button onClick="kick()">蹴る</button>
		<button onClick="slap()">叩く</button>
		<p>スコア: <span id="score">0</span></p>
	</div>
	<script>
		let score = 0;

function hit() {
			score += 10;
			document.getElementById("score").innerText = score;
		}

function kick() {
			score += 20;
			document.getElementById("score").innerText = score;
		}

function slap() {
			score += 5;
			document.getElementById("score").innerText = score;
		}
	</script>
</body>
</html>

※このコードは、オンラインエディタ上で動作確認をしております。一部スタイルが適用されていない場合があります。