Make me a snake game's game

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

No:22947

←

Prev Next

→

Make me a snake game
Developer User10612｜Date and time 23/10/26 22:59:30
Build time 95.439 sec｜Game capacity 3.702KB｜

Script

Sure! Here's an example of a simple snake game implemented as a single HTML file:

To play the game, you can copy and paste the above code into a new HTML file and open it in a web browser. The game will be displayed on a canvas element with the snake (green squares) and the apple (red square). The snake can be controlled using the arrow keys on your keyboard. The objective is to eat the apples and avoid colliding with the snake's body or the walls of the game area.

←

Prev　Next

→ 　

Back　

[PR]現在のゲームギフトランキング

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

Sure! Here's an example of a simple snake game implemented as a single HTML file:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Snake Game</title>
    <style>
        #gameCanvas {
            border: 1px solid #000;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="400" height="400"></canvas>

function drawSquare(x, y, color) {
            ctx.fillStyle = color;
            ctx.fillRect(x * tileSize, y * tileSize, tileSize, tileSize);
        }

function drawSnake() {
            snake.forEach(segment => {
                drawSquare(segment.x, segment.y, "#008000");
            });
        }

function drawApple() {
            drawSquare(apple.x, apple.y, "#FF0000");
        }

function moveSnake() {
            var head = { x: snake[0].x + xVelocity, y: snake[0].y + yVelocity };
            snake.unshift(head);

if (head.x === apple.x && head.y === apple.y) {
                score++;
                createApple();
            } else {
                snake.pop();
            }
        }

function createApple() {
            apple.x = Math.floor(Math.random() * tileCount);
            apple.y = Math.floor(Math.random() * tileCount);
        }

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

// Collision with wall
            if (head.x < 0 || head.x >= tileCount || head.y < 0 || head.y >= tileCount) {
                gameOver();
            }

// Collision with self
            for (var i = 1; i < snake.length; i++) {
                if (head.x === snake[i].x && head.y === snake[i].y) {
                    gameOver();
                }
            }
        }

function gameOver() {
            alert("Game Over! Your score was: " + score);
            snake = [{ x: 10, y: 10 }];
            xVelocity = 0;
            yVelocity = 0;
            score = 0;
            createApple();
        }

function update() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            drawSnake();
            drawApple();
            moveSnake();
            checkCollision();
        }

function keyDown(event) {
            switch (event.keyCode) {
                case 37: // Left
                    xVelocity = -1;
                    yVelocity = 0;
                    break;
                case 38: // Up
                    xVelocity = 0;
                    yVelocity = -1;
                    break;
                case 39: // Right
                    xVelocity = 1;
                    yVelocity = 0;
                    break;
                case 40: // Down
                    xVelocity = 0;
                    yVelocity = 1;
                    break;
            }
        }

// Event listeners
        document.addEventListener("keydown", keyDown);

// Start the game loop
        setInterval(update, 100);
    </script>
</body>
</html>
```