Vytvoř hru hada s mnoha jablky které had žere a z jablek roste's game

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

No:48242

←

Prev Next

→

Vytvoř hru hada s mnoha jablky které had žere a z ..ALL
Developer User20718｜Date and time 24/3/1 20:13:57
Build time 10.9 sec｜Game capacity 2.327KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
  <title>Snake Game</title>
  <style>
    body {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
      background-color: #f0f0f0;
    }
    #game-board {
      width: 400px;
      height: 400px;
      border: 2px solid #000;
    }
  </style>
</head>
<body>
  <div id="game-board"></div>
  <script>
    const board = document.getElementById('game-board');
    const ctx = board.getContext('2d');
    const boardSize = 20;
    const cellSize = board.width / boardSize;
    let snake = [{ x: 10, y: 10 }];
    let apple = { x: Math.floor(Math.random() * boardSize), y: Math.floor(Math.random() * boardSize) };
    let dx = 1;
    let dy = 0;
    let score = 0;

function drawCell(x, y) {
      ctx.fillRect(x * cellSize, y * cellSize, cellSize, cellSize);
    }

function drawSnake() {
      ctx.fillStyle = '#000';
      snake.forEach((cell) => {
        drawCell(cell.x, cell.y);
      });
    }

function drawApple() {
      ctx.fillStyle = 'red';
      drawCell(apple.x, apple.y);
    }

function draw() {
      ctx.clearRect(0, 0, board.width, board.height);
      drawSnake();
      drawApple();
    }

function handleInput(event) {
      switch (event.key) {
        case 'ArrowUp':
          dx = 0;
          dy = -1;
          break;
        case 'ArrowDown':
          dx = 0;
          dy = 1;
          break;
        case 'ArrowLeft':
          dx = -1;
          dy = 0;
          break;
        case 'ArrowRight':
          dx = 1;
          dy = 0;
          break;
      }
    }

document.addEventListener('keydown', handleInput);
    const gameLoop = setInterval(update, 100);

</script>
</body>
</html>