AI game creator

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

No:49805

←

Prev Next

→

Make a snake game
Developer User21150｜Date and time 24/3/6 11:57:39
Build time 14.27 sec｜Game capacity 2.983KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームアプリランキング

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Snake Game</title>
<style>
    body {
        margin: 0;
        padding: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
        background-color: #f0f0f0;
    }
    canvas {
        border: 1px solid black;
    }
</style>
</head>
<body>

let apple = { x: 15, y: 15 };

let dx = 0;
    let dy = 1;

function clearCanvas() {
        ctx.fillStyle = 'white';
        ctx.fillRect(0, 0, canvas.width, canvas.height);
    }

function drawSnake() {
        ctx.fillStyle = 'green';
        snake.forEach(segment => {
            ctx.fillRect(segment.x * grid, segment.y * grid, grid, grid);
        });
    }

function moveSnake() {
        const head = { x: snake[0].x + dx, y: snake[0].y + dy };
        snake.unshift(head);

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

function createApple() {
        apple.x = Math.floor(Math.random() * Math.floor(canvas.width / grid));
        apple.y = Math.floor(Math.random() * Math.floor(canvas.height / grid));
    }

function drawApple() {
        ctx.fillStyle = 'red';
        ctx.fillRect(apple.x * grid, apple.y * grid, grid, grid);
    }

function checkCollision() {
        if (snake[0].x < 0 || snake[0].x >= canvas.width / grid || snake[0].y < 0 || snake[0].y >= canvas.height / grid) {
            return true;
        }

for (let i = 1; i < snake.length; i++) {
            if (snake[i].x === snake[0].x && snake[i].y === snake[0].y) {
                return true;
            }
        }

return false;
    }

createApple();
    gameLoop();
</script>

</body>
</html>