AI game creator

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

No:42357

←

Prev Next

→

Snake Game
Developer User18870｜Date and time 24/2/11 14:44:09
Build time 13.696 sec｜Game capacity 5.163KB｜

Script

Sure, here's a simple implementation of the Snake Game using HTML, JavaScript, and pictograms for smartphone operation:

Game Over!

This implementation creates a game board using HTML and CSS, and uses JavaScript to handle the game logic. The snake is controlled using the arrow keys on a smartphone, and pictograms can be added to represent the snake and apple in the CSS styles. The game starts automatically and ends when the snake collides with the wall or itself. The game over message is displayed when the game ends.

←

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 Snake Game using HTML, JavaScript, and pictograms for smartphone operation:

```html
<!DOCTYPE html>
<html>
  <head>
    <title>Snake Game</title>
    <style>
      #game-board {
        width: 320px;
        height: 320px;
        border: 1px solid black;
        display: flex;
        flex-wrap: wrap;
      }
      .cell {
        width: 20px;
        height: 20px;
        background-color: white;
        border: 1px solid gray;
      }
      #game-over {
        display: none;
        font-size: 32px;
        color: red;
        text-align: center;
        margin-top: 100px;
      }
    </style>
  </head>
  <body>
    <div id="game-board"></div>
    <div id="game-over">Game Over!</div>

// Game Variables
      let snake = [{ row: 8, col: 8 }]; // Initial position of the snake
      let direction = 'right'; // Current direction of the snake
      let apple = getRandomCell(); // Initial position of the apple
      let gameInterval;

// Game Initialization
      const gameBoard = document.getElementById('game-board');
      document.addEventListener('keydown', changeDirection);

for (let row = 0; row < boardSize; row++) {
        for (let col = 0; col < boardSize; col++) {
          const cell = document.createElement('div');
          cell.classList.add('cell');
          cell.id = `${row}-${col}`;
          gameBoard.appendChild(cell);
        }
      }

// Start the game
      startGame();

// Game Functions
      function startGame() {
        gameInterval = setInterval(gameLoop, frameRate);
      }

function changeDirection(event) {
        const key = event.key;
        switch (key) {
          case 'ArrowUp':
            direction = 'up';
            break;
          case 'ArrowDown':
            direction = 'down';
            break;
          case 'ArrowLeft':
            direction = 'left';
            break;
          case 'ArrowRight':
            direction = 'right';
            break;
        }
      }

function isCollision() {
        const head = snake[0];
        return (
          head.row < 0 ||
          head.row >= boardSize ||
          head.col < 0 ||
          head.col >= boardSize ||
          snake.slice(1).some((body) => body.row === head.row && body.col === head.col)
        );
      }

function isAppleEaten() {
        const head = snake[0];
        return head.row === apple.row && head.col === apple.col;
      }

function growSnake() {
        const tail = { ...snake[snake.length - 1] };
        snake.push(tail);
        initialSnakeLength++;
      }

function endGame() {
        clearInterval(gameInterval);
        const gameOverMsg = document.getElementById('game-over');
        gameOverMsg.style.display = 'block';
      }

function getRandomCell() {
        const row = Math.floor(Math.random() * boardSize);
        const col = Math.floor(Math.random() * boardSize);
        return { row, col };
      }
    </script>
  </body>
</html>
```