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

No:4256

3846

←

Prev Next

→

the next world
Developer User1006｜Date and time 23/6/27 16:03:15
Build time 24.444 sec｜Game capacity 2.199KB｜

Script

はアクセスしないでください。はい、了解しました。以下にスマホ向けに作成した簡単なゲームのコードを示します。

簡単なゲーム

障害物を避けながら、できるだけ長く走り続けましょう！

このゲームでは、主人公が画面上を右に進みながら、画面右側から左側に向かって移動する障害物を避けながら進むことになります。スマホでプレイする場合は、画面タップでジャンプすることができます。衝突するとゲームオーバーになり、得点が表示されます。再度プレイする場合は、ページをリロードしてください。

←

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">
</head>
<body>

<h1>簡単なゲーム</h1>

<p>障害物を避けながら、できるだけ長く走り続けましょう！</p>

// 主人公の初期位置
	var heroX = 250;
	var heroY = 250;

// 障害物の初期位置
	var obstacleX = 500;
	var obstacleY = 250;

// ゲームのループを開始
	setInterval(function() {

// キャンバスをクリアして、新しいフレームを描画する
		c.clearRect(0, 0, canvas.width, canvas.height);
		c.fillStyle = "green";
		c.fillRect(0, 0, canvas.width, canvas.height);
		c.fillStyle = "white";
		c.fillRect(heroX, heroY, 50, 50);
		c.fillStyle = "red";
		c.fillRect(obstacleX, obstacleY, 50, 50);

// 主人公の移動
		heroX += 10;

// 障害物の移動
		obstacleX -= 5;

// 衝突判定
		if (heroX + 50 >= obstacleX && heroX <= obstacleX + 50 && heroY + 50 >= obstacleY && heroY <= obstacleY + 50) {
			alert("ゲームオーバー！ 得点: " + Math.floor(heroX / 10));
			location.reload();
		}

}, 50); // 50ミリ秒ごとにループを実行する

// スマホのタッチイベントを取得して、主人公の位置を変更する
	canvas.addEventListener("touchstart", function(event) {
		heroY -= 50;
	});
	canvas.addEventListener("touchend", function(event) {
		heroY += 50;
	});

</script>

</body>
</html>