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

No:271

80

A game that forces the developer Hisashi to appeas..ALL
Developer どうスクのアプデ早くしろよ！🤬💢｜Date and time 23/6/11 14:52:05
Build time 61.649 sec｜Game capacity 5.069KB｜

ゲームの概要: プレイヤーは開発者ひさしに代わって、力づくでアプリをアップデートしなければなりません。アプデの前には説明が表示され、プレイヤーは「了解」または「ゲーム終了」を選択できます。アプデに進む場合、プレイヤーは完成させるべき5つのタスクに挑戦します。実装: 以下が実際のコードです。

アプデさせるゲーム

開発者ひさしがアプデを怠っているので、プレイヤーが力づくでアップデートしなければなりません。まずは以下の説明に注意して、「了解」または「ゲーム終了」を選択してください。

タスクリスト

以下の5つのタスクを一つずつ完了させてください。一度完了したタスクは再度挑戦できません。

📝 開発者ひさしのメモを更新する
👨‍💻 ファイルをアップデートする
🔧 バグを修正する
📊 ステータスをアップデートする
🎉 ゲームをリリースする

このコードでは、HTMLとCSSを使用して見かけを作成し、JavaScriptを使用してゲームの機能を実装しています。プログラムの詳細については、各行のコメントを参照してください。スマートフォンでの操作に最適化されているため、携帯電話で簡単かつ便利にプレイできます。また、絵文字を使用することで、ゲームがより楽しくなります。

→ 　

1　

1　

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

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

(C)2023 HisashiApp

ゲームの概要:
プレイヤーは開発者ひさしに代わって、力づくでアプリをアップデートしなければなりません。アプデの前には説明が表示され、プレイヤーは「了解」または「ゲーム終了」を選択できます。アプデに進む場合、プレイヤーは完成させるべき5つのタスクに挑戦します。

実装:
以下が実際のコードです。

<!DOCTYPE html>
<html>
<head>
	<title>アプデさせるゲーム</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		body {
			margin: 0;
			padding: 0;
			font-family: Arial, sans-serif;
			background-color: #f0f0f0;
		}

h1, h2 {
			text-align: center;
			color: #333;
			margin-top: 20px;
			margin-bottom: 10px;
		}

p {
			margin: 10px 0;
			color: #555;
			text-align: justify;
			padding: 0 10%;
		}

button {
			display: block;
			margin: 0 auto;
			padding: 10px 20px;
			border: none;
			border-radius: 5px;
			background-color: #0077cc;
			color: #fff;
			font-size: 20px;
			cursor: pointer;
			transition: background-color .3s, color .3s;
		}

button:hover {
			background-color: #005cb2;
		}

button:focus {
			outline: none;
		}

.game-window {
			background-color: #fff;
			border: solid 2px #ddd;
			border-radius: 10px;
			padding: 20px;
			margin: 20px auto;
			max-width: 400px;
		}

.task-list {
			list-style: none;
			margin: 0;
			padding: 0;
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			grid-gap: 10px;
		}

.task-item {
			background-color: #ddd;
			padding: 10px;
			border-radius: 5px;
			text-align: center;
			cursor: pointer;
			transition: background-color .3s;
		}

.task-item:hover {
			background-color: #ccc;
		}

.task-item.disabled {
			background-color: #f0f0f0;
			color: #bbb;
			cursor: default;
		}

.task-item.complete {
			background-color: #bfb;
			color: #fff;
			cursor: default;
		}

.emoji {
			font-size: 30px;
			margin: 0 5px;
		}
	</style>
</head>
<body>
	<div class="game-window">
		<h1>アプデさせるゲーム</h1>
		<p>開発者ひさしがアプデを怠っているので、プレイヤーが力づくでアップデートしなければなりません。まずは以下の説明に注意して、「了解」または「ゲーム終了」を選択してください。</p>
		<button id="start-button">了解</button>
		<button id="end-button">ゲーム終了</button>

<h2>タスクリスト</h2>
		<p>以下の5つのタスクを一つずつ完了させてください。一度完了したタスクは再度挑戦できません。</p>
		<ul class="task-list">
			<li class="task-item" id="task-1"><span class="emoji">📝</span> 開発者ひさしのメモを更新する</li>
			<li class="task-item" id="task-2"><span class="emoji">👨‍💻</span> ファイルをアップデートする</li>
			<li class="task-item" id="task-3"><span class="emoji">🔧</span> バグを修正する</li>
			<li class="task-item" id="task-4"><span class="emoji">📊</span> ステータスをアップデートする</li>
			<li class="task-item" id="task-5"><span class="emoji">🎉</span> ゲームをリリースする</li>
		</ul>
	</div>

<script>
		// Start button click event listener
		document.getElementById('start-button').addEventListener('click', function() {
			document.getElementById('start-button').style.display = 'none';
			document.getElementById('end-button').style.display = 'none';
			document.querySelector('h2').style.display = 'block';
			document.querySelector('p:nth-of-type(2)').style.display = 'block';
			document.querySelector('.task-list').style.display = 'grid';
		});

// End button click event listener
		document.getElementById('end-button').addEventListener('click', function() {
			window.close();
		});

// Task item click event listener
		document.querySelectorAll('.task-item').forEach(function(item) {
			item.addEventListener('click', function() {
				if (item.classList.contains('complete') || item.classList.contains('disabled')) {
					return;
				}
				item.classList.add('complete');
				item.innerHTML = item.innerHTML.replace('👍', '🎉');
				let completedTaskCount = document.querySelectorAll('.task-item.complete').length;
				if (completedTaskCount === 5) {
					document.querySelector('.task-list').innerHTML += '<li class="task-item complete"><span class="emoji">🎉</span> おめでとうございます！アップデートが完了しました！</li>';
					document.querySelector('.task-list').style.gridTemplateColumns = '1fr';
				}
			});
		});
	</script>
</body>
</html>

このコードでは、HTMLとCSSを使用して見かけを作成し、JavaScriptを使用してゲームの機能を実装しています。プログラムの詳細については、各行のコメントを参照してください。

スマートフォンでの操作に最適化されているため、携帯電話で簡単かつ便利にプレイできます。また、絵文字を使用することで、ゲームがより楽しくなります。