AI game creator

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

No:46600

←

Prev Next

→

Snake Game
Developer User20154｜Date and time 24/2/25 10:54:18
Build time 11.192 sec｜Game capacity 3.547KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

<!DOCTYPE html>
<html>
  <head>
    <title>Snake Game</title>
    <style>
      #game-board {
        display: grid;
        grid-template-columns: repeat(20, 20px);
      }
    </style>
  </head>
  <body>
    <div id="game-board"></div>

let snake = [{ x: 10, y: 10 }];
      let direction = 'right';
      let food = { x: 5, y: 5 };
      let interval;

function drawSnake() {
        snake.forEach((segment) => {
          const snakeSegment = board.children[segment.y * width + segment.x];
          snakeSegment.style.background = 'green';
        });
      }

function drawFood() {
        const foodCell = board.children[food.y * width + food.x];
        foodCell.style.background = 'red';
      }

function generateFood() {
        food.x = Math.floor(Math.random() * width);
        food.y = Math.floor(Math.random() * height);
      }

function moveSnake() {
        const head = { ...snake[0] };

switch (direction) {
          case 'up':
            head.y--;
            break;
          case 'down':
            head.y++;
            break;
          case 'left':
            head.x--;
            break;
          case 'right':
            head.x++;
            break;
        }

snake.unshift(head);

if (head.x === food.x && head.y === food.y) {
          generateFood();
        } else {
          snake.pop();
        }
      }

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

if (head.x < 0 || head.x >= width || head.y < 0 || head.y >= height) {
          return true;
        }

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

return false;
      }

function gameOver() {
        clearInterval(interval);
        alert('Game Over! Your final score is: ' + (snake.length - 1));
      }

function updateGame() {
        moveSnake();
        if (checkCollision()) {
          gameOver();
        }

Array.from(board.children).forEach((cell) => {
          cell.style.background = 'black';
        });

drawFood();
        drawSnake();
      }

createBoard();
      drawSnake();
      drawFood();
      interval = setInterval(updateGame, snakeSpeed);