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

No:2866

4422

←

Prev Next

→

ギリギリストップ画面の上から絵文字が落ちてきます。画面下のJavaScriptによって線画された..ALL
Developer anonymous｜Date and time 70/1/1 9:35:42
Build time unknown sec｜Game capacity 2.142KB｜

Script

ギリギリストップ

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

<!DOCTYPE html>
<html>
<head>
	<title>ギリギリストップ</title>
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<style>
		body {
			margin: 0;
			padding: 0;
			background-color: black;
			color: white;
			font-size: 20px;
			font-family: Arial;
			text-align: center;
		}
		canvas {
			display: block;
		}
		button {
			padding: 10px 20px;
			background-color: white;
			color: black;
			font-size: 20px;
			border: none;
			border-radius: 5px;
			margin: 20px;
			cursor: pointer;
		}
	</style>
</head>
<body>
	<h1>ギリギリストップ</h1>
	<canvas id="game-canvas"></canvas>
	<button id="stop-btn">ストップ</button>
	<script>
		const canvas = document.getElementById("game-canvas");
		canvas.width = window.innerWidth;
		canvas.height = window.innerHeight;

const ctx = canvas.getContext("2d");

const emojis = ["😀", "😎", "🤖", "🐶", "🐱", "🦊", "🐻", "🐸", "🐳", "🌵"];

let y = -50;
		let x = Math.floor(Math.random() * (canvas.width - 50));
		let movementSpeed = 5;
		let score = 0;

function update() {
			ctx.clearRect(0, 0, canvas.width, canvas.height);

for (let i = 0; i < emojis.length; i++) {
				ctx.fillText(emojis[i], x, y + i * 50);
			}

if (y > canvas.height - 150) {
				if (x > lineX - 50 && x < lineX + 50) {
					score++;
					movementSpeed += 0.2;
				} else {
					gameOver();
					return;
				}
				y = -50;
				x = Math.floor(Math.random() * (canvas.width - 50));
			}

y += movementSpeed;

ctx.beginPath();
			ctx.moveTo(lineX - 50, canvas.height - 100);
			ctx.lineTo(lineX + 50, canvas.height - 100);
			ctx.stroke();

ctx.fillText("スコア: " + score, 50, 50);

requestAnimationFrame(update);
		}

let lineX = canvas.width / 2;

document.getElementById("stop-btn").addEventListener("click", function() {
			lineX = canvas.width / 2;
		});

function gameOver() {
			ctx.clearRect(0, 0, canvas.width, canvas.height);
			ctx.fillText("ゲームオーバー！", canvas.width/2, canvas.height/2);
			ctx.fillText("スコア: " + score, canvas.width/2, canvas.height/2 + 50);
		}

update();
	</script>
</body>
</html>