AI game creator

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

No:40009

103

←

Prev Next

→

ヘビゲーム
Developer 食べる鶏と熱いタバスコ｜Date and time 24/1/31 18:06:17
Build time 16.752 sec｜Game capacity 2.951KB｜

Script

了解しました。以下にヘビゲームの実装例を記述します。

このHTMLファイルをブラウザで開くと、スネークゲームがプレイできます。スマホでも操作可能です。絵文字は使用していませんが、任意の絵文字を適宜追加しても構いません。

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

了解しました。以下にヘビゲームの実装例を記述します。

```html
<!DOCTYPE html>
<html>
<head>
	<title>ヘビゲーム</title>
	<style>
		#game {
			width: 400px;
			height: 400px;
			border: 1px solid black;
			position: relative;
		}

.snake {
			position: absolute;
			background-color: green;
			width: 20px;
			height: 20px;
		}

.food {
			position: absolute;
			background-color: red;
			width: 20px;
			height: 20px;
		}
	</style>
</head>
<body>
	<div id="game"></div>

function draw() {
				gameBoard.innerHTML = "";

snake.forEach(segment => {
					const snakeElement = document.createElement("div");
					snakeElement.style.left = segment.x + "px";
					snakeElement.style.top = segment.y + "px";
					snakeElement.classList.add("snake");
					gameBoard.appendChild(snakeElement);
				});

const foodElement = document.createElement("div");
				foodElement.style.left = food.x + "px";
				foodElement.style.top = food.y + "px";
				foodElement.classList.add("food");
				gameBoard.appendChild(foodElement);
			}

function update() {
				const head = {x: snake[0].x, y: snake[0].y};

if (direction === "right") head.x += 20;
				if (direction === "left") head.x -= 20;
				if (direction === "up") head.y -= 20;
				if (direction === "down") head.y += 20;

snake.unshift(head);

if (head.x === food.x && head.y === food.y) {
					food = {x: Math.floor(Math.random() * 20) * 20, y: Math.floor(Math.random() * 20) * 20};
				} else {
					snake.pop();
				}
			}

function checkCollision() {
				const head = snake[0];

if (head.x < 0 || head.x >= 400 || head.y < 0 || head.y >= 400) {
					clearInterval(gameLoop);
					alert("ゲームオーバー！");
				}

for (let i = 1; i < snake.length; i++) {
					if (snake[i].x === head.x && snake[i].y === head.y) {
						clearInterval(gameLoop);
						alert("ゲームオーバー！");
					}
				}
			}

function handleKeyPress(event) {
				if (event.key === "ArrowRight" && direction !== "left") direction = "right";
				if (event.key === "ArrowLeft" && direction !== "right") direction = "left";
				if (event.key === "ArrowUp" && direction !== "down") direction = "up";
				if (event.key === "ArrowDown" && direction !== "up") direction = "down";
			}

document.addEventListener("keydown", handleKeyPress);

gameLoop = setInterval(function() {
				update();
				checkCollision();
				draw();
			}, 100);
		});
	</script>
</body>
</html>
```