AI game creator

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

No:36612

←

Prev Next

→

Snake Game
Developer User16842｜Date and time 24/1/18 2:42:39
Build time 14.738 sec｜Game capacity 3.7KB｜

Script

Sure! Here's a simple implementation of the classic Snake Game as a single HTML file using JavaScript, enclosed in script tags:

You can copy and paste this code into a single HTML file and open it in a web browser to play the Snake Game. You control the snake's movement using the arrow keys on your smartphone or keyboard.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

Sure! Here's a simple implementation of the classic Snake Game as a single HTML file using JavaScript, enclosed in script tags:

```html
<!DOCTYPE html>
<html>
<head>
  <style>
    #game-board {
      position: relative;
      width: 400px;
      height: 400px;
      border: 1px solid black;
    }

.cell {
      position: absolute;
      width: 20px;
      height: 20px;
    }

.snake {
      background-color: green;
    }

.food {
      background-color: red;
    }
  </style>
</head>
<body>
  <div id="game-board"></div>

// Create cells on the board
      for (let row = 0; row < boardSize; row++) {
        for (let col = 0; col < boardSize; col++) {
          const cell = document.createElement("div");
          cell.className = "cell";
          cells.push(cell);
          board.appendChild(cell);
        }
      }

// Initialize snake
      const snake = [{row: 10, col: 10}];
      let direction = "right";

// Generate random food position
      let food = getRandomPosition();
      cells[food].classList.add("food");

// Game loop
      setInterval(function() {
        // Move the snake
        const head = Object.assign({}, snake[0]);
        switch (direction) {
          case "up":
            head.row--;
            break;
          case "down":
            head.row++;
            break;
          case "left":
            head.col--;
            break;
          case "right":
            head.col++;
            break;
        }
        
        // Check if snake hits the wall or itself
        if (
          head.row < 0 ||
          head.row >= boardSize ||
          head.col < 0 ||
          head.col >= boardSize ||
          snake.some(seg => seg.row === head.row && seg.col === head.col)
        ) {
          // Game over
          alert("Game over!");
          window.location.reload();
          return;
        }

snake.unshift(head);

// Check if snake eats the food
        if (head.row === cells[food].rowIndex && head.col === cells[food].cellIndex) {
          cells[food].classList.remove("food");
          food = getRandomPosition();
          cells[food].classList.add("food");
        } else {
          snake.pop();
        }

// Render snake
        cells.forEach(cell => {
          cell.className = "cell";
        });

snake.forEach(seg => {
          const cellIndex = seg.row * boardSize + seg.col;
          cells[cellIndex].classList.add("snake");
        });
      }, 200);

// Handle keyboard input
      document.addEventListener("keydown", function(event) {
        switch (event.key) {
          case "ArrowUp":
            if (direction !== "down")
              direction = "up";
            break;
          case "ArrowDown":
            if (direction !== "up")
              direction = "down";
            break;
          case "ArrowLeft":
            if (direction !== "right")
              direction = "left";
            break;
          case "ArrowRight":
            if (direction !== "left")
              direction = "right";
            break;
        }
      });

// Generate random position on the board
      function getRandomPosition() {
        return Math.floor(Math.random() * boardSize * boardSize);
      }
    });
  </script>
</body>
</html>
```

You can copy and paste this code into a single HTML file and open it in a web browser to play the Snake Game. You control the snake's movement using the arrow keys on your smartphone or keyboard.