AI game creator

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

No:19798

←

Prev Next

→

Snake Game
Developer User8828｜Date and time 23/10/6 21:56:04
Build time 25.494 sec｜Game capacity 4.434KB｜

Script

Sure! Here's a basic implementation of the Snake Game in a single HTML file using JavaScript. Please note that this is a simplified version, and you can always enhance and add more features to it.

To play the game: - Open the HTML file in a web browser. - Use the arrow keys to control the snake's movement. - Try to eat the red food without hitting the walls or yourself. - Press the spacebar to pause/resume the game. Please note that this is a basic implementation, and you can add more features, styling, and enhancements as desired.

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいゲームランキング

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

Sure! Here's a basic implementation of the Snake Game in a single HTML file using JavaScript. Please note that this is a simplified version, and you can always enhance and add more features to it.

```html
<!DOCTYPE html>
<html>
<head>
  <title>Snake Game</title>
  <style>
    #game-board {
      width: 400px;
      height: 400px;
      border: 1px solid black;
    }
  </style>
</head>
<body>
  <div id="game-board"></div>

// Game variables
      let snake = [
        { x: 10, y: 10 } // Snake's initial position
      ];
      let direction = "right"; // Initial direction of the snake
      let isGamePaused = false;
      let food = getRandomPosition();

// Helper function to get random position
      function getRandomPosition() {
        return {
          x: Math.floor(Math.random() * boardSize),
          y: Math.floor(Math.random() * boardSize)
        };
      }

// Helper function to check if the snake hits itself or game board boundaries
      function isCollision(position) {
        return (
          position.x < 0 ||
          position.y < 0 ||
          position.x >= boardSize ||
          position.y >= boardSize ||
          snake.some(seg => seg.x === position.x && seg.y === position.y)
        );
      }

// Function to update the game board
      function update() {
        if (isGamePaused) return;
        const head = {
          x: snake[0].x + (direction === "right" ? 1 : direction === "left" ? -1 : 0),
          y: snake[0].y + (direction === "down" ? 1 : direction === "up" ? -1 : 0)
        };

if (isCollision(head)) {
          clearInterval(gameLoop);
          alert("Game Over!");
          return;
        }

snake.unshift(head);

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

draw();
      }

// Function to draw the game board
      function draw() {
        const gameBoard = document.getElementById("game-board");
        gameBoard.innerHTML = "";

snake.forEach(segment => {
          const square = document.createElement("div");
          square.style.cssText = `
              width: ${squareSize}px;
              height: ${squareSize}px;
              background-color: black;
              position: absolute;
              top: ${segment.y * squareSize}px;
              left: ${segment.x * squareSize}px;
            `;
          gameBoard.appendChild(square);
        });

// Function to handle user input
      function handleInput(event) {
        if (isGamePaused) return;
        switch (event.keyCode) {
          case 37: // Left arrow key
            if (direction !== "right") direction = "left";
            break;
          case 38: // Up arrow key
            if (direction !== "down") direction = "up";
            break;
          case 39: // Right arrow key
            if (direction !== "left") direction = "right";
            break;
          case 40: // Down arrow key
            if (direction !== "up") direction = "down";
            break;
          case 32: // Spacebar key
            isGamePaused = !isGamePaused;
            break;
        }
      }

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

// Start the game loop
      const gameLoop = setInterval(update, speed);
    });
  </script>
</body>
</html>
```

Please note that this is a basic implementation, and you can add more features, styling, and enhancements as desired.