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

No:32058

99

Snake Game
Developer User15322｜Date and time 23/12/29 15:43:42
Build time 48.312 sec｜Game capacity 5.281KB｜

As an AI text-based model, I am unable to provide a single HTML file directly. However, I can help you understand the necessary steps and provide you with the code to create a simple Snake Game using JavaScript within an HTML file. You can copy and paste the code into a single HTML file and run it in your browser. Please note that the code I provide here may not include pictograms, but you can enhance it by adding images or other graphical elements as you see fit. Remember to save the HTML file as a ".html" extension. Here's an example of a basic Snake Game implemented in HTML using JavaScript:

Snake Game

Copy and save the above code into an HTML file, and open it in your browser. You should see a simple Snake Game interface with a grid, where you can control the snake using arrow keys on your smartphone. Note: This is a basic implementation of the Snake Game using JavaScript and HTML. You can further customize the game by adding additional features, sound effects, and pictograms as per your requirements.

→ 　

0　

0　

　
　
　
　

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

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

(C)2023 HisashiApp

As an AI text-based model, I am unable to provide a single HTML file directly. However, I can help you understand the necessary steps and provide you with the code to create a simple Snake Game using JavaScript within an HTML file. You can copy and paste the code into a single HTML file and run it in your browser.

Please note that the code I provide here may not include pictograms, but you can enhance it by adding images or other graphical elements as you see fit. Remember to save the HTML file as a ".html" extension.

Here's an example of a basic Snake Game implemented in HTML using JavaScript:

```html
<!DOCTYPE html>
<html>
  <head>
    <title>Snake Game</title>
    <style>
      #game-board {
        position: relative;
        width: 400px;
        height: 400px;
        border: 1px solid black;
      }
      .cell {
        width: 20px;
        height: 20px;
        border: 1px solid gray;
      }
      #snake {
        background-color: green;
      }
      #food {
        background-color: red;
      }
    </style>
  </head>
  <body>
    <h1>Snake Game</h1>
    <div id="game-board"></div>

<script>
      document.addEventListener("DOMContentLoaded", function () {
        const boardSize = 20; // Number of cells in each row and column
        const cellSize = 20; // Size of each cell in pixels
        const initialSnakeLength = 3; // Initial length of the snake

let gameBoard = document.getElementById("game-board");
        let cells = [];

// Create the game board grid
        for (let i = 0; i < boardSize; i++) {
          let row = [];
          for (let j = 0; j < boardSize; j++) {
            let cell = document.createElement("div");
            cell.classList.add("cell");
            cell.style.left = j * cellSize + "px";
            cell.style.top = i * cellSize + "px";
            gameBoard.appendChild(cell);
            row.push(cell);
          }
          cells.push(row);
        }

// Create the snake
        let snake = [];
        for (let i = 0; i < initialSnakeLength; i++) {
          let cell = cells[0][i];
          cell.classList.add("snake");
          snake.push(cell);
        }

// Generate random food
        let food = generateFood();

// Initial direction of the snake
        let direction = "right";

// Listen for arrow key presses
        document.addEventListener("keydown", function (event) {
          if (event.keyCode === 37 && direction !== "right") {
            direction = "left";
          } else if (event.keyCode === 38 && direction !== "down") {
            direction = "up";
          } else if (event.keyCode === 39 && direction !== "left") {
            direction = "right";
          } else if (event.keyCode === 40 && direction !== "up") {
            direction = "down";
          }
        });

// Start the game
        let gameInterval = setInterval(moveSnake, 200);

function moveSnake() {
          let head = snake[snake.length - 1];
          let newHead;

// Update the coordinates based on the direction
          let headX = parseInt(head.style.left) / cellSize;
          let headY = parseInt(head.style.top) / cellSize;

if (direction === "right") {
            newHead = cells[headY][(headX + 1) % boardSize];
          } else if (direction === "left") {
            newHead = cells[headY][(headX - 1 + boardSize) % boardSize];
          } else if (direction === "up") {
            newHead = cells[(headY - 1 + boardSize) % boardSize][headX];
          } else if (direction === "down") {
            newHead = cells[(headY + 1) % boardSize][headX];
          }

// Check for collision with food
          if (newHead === food) {
            snake.push(newHead);
            newHead.classList.add("snake");
            food.classList.remove("food");
            food = generateFood();
          } else {
            snake.push(newHead);
            newHead.classList.add("snake");
            let tail = snake.shift();
            tail.classList.remove("snake");
          }

// Check for collision with snake body
          if (snake.indexOf(newHead) !== snake.length - 1) {
            gameOver();
          }
        }

function generateFood() {
          let emptyCells = [];
          for (let i = 0; i < boardSize; i++) {
            for (let j = 0; j < boardSize; j++) {
              if (!cells[i][j].classList.contains("snake")) {
                emptyCells.push(cells[i][j]);
              }
            }
          }
          let foodCell = emptyCells[Math.floor(Math.random() * emptyCells.length)];
          foodCell.classList.add("food");
          return foodCell;
        }

function gameOver() {
          clearInterval(gameInterval);
          alert("Game Over!");
        }
      });
    </script>
  </body>
</html>
```

Copy and save the above code into an HTML file, and open it in your browser. You should see a simple Snake Game interface with a grid, where you can control the snake using arrow keys on your smartphone.

Note: This is a basic implementation of the Snake Game using JavaScript and HTML. You can further customize the game by adding additional features, sound effects, and pictograms as per your requirements.