AI game creator

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

No:21276

←

Prev Next

→

Snake Game
Developer User9737｜Date and time 23/10/14 14:19:26
Build time 80.877 sec｜Game capacity 3.421KB｜

Script

Sure! Here's a basic implementation of the Snake Game using JavaScript and HTML:

You can copy this code into a single HTML file and open it in a web browser, preferably on a smartphone to play the game. The game uses arrow keys for controlling the snake. The snake must eat the red food (represented by rectangles) and grow while avoiding the walls and colliding with itself.

←

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 using JavaScript and HTML:

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

// Handle key press
    document.addEventListener("keydown", changeDirection);

// Change direction based on arrow key press
    function changeDirection(event) {
      if (event.keyCode === 37 && dx !== gridSize) {
        dx = -gridSize;
        dy = 0;
      }
      else if (event.keyCode === 38 && dy !== gridSize) {
        dx = 0;
        dy = -gridSize;
      }
      else if (event.keyCode === 39 && dx !== -gridSize) {
        dx = gridSize;
        dy = 0;
      }
      else if (event.keyCode === 40 && dy !== -gridSize) {
        dx = 0;
        dy = gridSize;
      }
    }

// Game loop
    function gameLoop() {
      clearCanvas();
      moveSnake();
      drawSnake();
      drawFood();

// Check for collision
      if (snakeCollision()) {
        resetGame();
      }

// Check if snake reached the food
      if (snake[0].x === food.x && snake[0].y === food.y) {
        snakeSize++;
        food = {x: Math.floor(Math.random() * (canvas.width / gridSize)) * gridSize, y: Math.floor(Math.random() * (canvas.height / gridSize)) * gridSize};
      }

setTimeout(gameLoop, 100);
    }

// Clear the canvas
    function clearCanvas() {
      ctx.clearRect(0, 0, canvas.width, canvas.height);
    }

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

// Remove tail if snake size exceeds
      if (snake.length > snakeSize) {
        snake.pop();
      }
    }

// Draw the snake
    function drawSnake() {
      ctx.fillStyle = "#000";
      snake.forEach(function (segment) {
        ctx.fillRect(segment.x, segment.y, gridSize, gridSize);
      });
    }

// Draw the food
    function drawFood() {
      ctx.fillStyle = "#f00";
      ctx.fillRect(food.x, food.y, gridSize, gridSize);
    }

// Check for collision with walls or the snake itself
    function snakeCollision() {
      var head = snake[0];
      return (
        head.x < 0 || head.x >= canvas.width ||
        head.y < 0 || head.y >= canvas.height ||
        snake.slice(1).some(function (segment) {
          return segment.x === head.x && segment.y === head.y;
        })
      );
    }

// Reset the game
    function resetGame() {
      snake = [{x: 0, y: 0}];
      dx = gridSize;
      dy = 0;
      snakeSize = 1;
    }

// Start the game loop
    gameLoop();
  </script>
</body>
</html>
```