Snake.io Mobile friendly's game

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

No:26766

105

←

Prev Next

→

Snake.io Mobile friendly
Developer User13175｜Date and time 23/12/2 11:11:16
Build time 116.708 sec｜Game capacity 4.497KB｜

Script

Sure! Here's the code for a simple Snake.io game implemented as a single HTML file:

To play the game, simply open the HTML file in a web browser that supports JavaScript. On a smartphone, you can also play it by opening the HTML file in a mobile web browser. Use the arrow keys to control the snake and try to eat as much food as possible without hitting the walls or the snake itself. Note: This game is a simplified version of the popular Snake.io game and may not have all the features and visuals you might expect from a complete game. Feel free to modify it or add more features to suit your needs.

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいゲームランキング

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

Sure! Here's the code for a simple Snake.io game implemented as a single HTML file:

```html
<!DOCTYPE html>
<html>
<head>
  <style>
    #gameCanvas {
      border: 1px solid black;
    }
  </style>
</head>
<body>
<script>
  // Game variables
  var canvas, ctx;
  var tileSize = 20;
  var columns, rows;
  var snake;
  var food;
  var score;

// Initialize game
  function init() {
    canvas = document.getElementById("gameCanvas");
    ctx = canvas.getContext("2d");
    columns = Math.floor(canvas.width / tileSize);
    rows = Math.floor(canvas.height / tileSize);

// Create the snake
    snake = {
      x: Math.floor(columns / 2),
      y: Math.floor(rows / 2),
      direction: "right",
      body: [{
        x: Math.floor(columns / 2 - 1),
        y: Math.floor(rows / 2)
      }]
    };

// Create the initial food
    createFood();

// Set initial score to zero
    score = 0;

// Start game loop
    gameLoop();
  }

// Game loop
  function gameLoop() {
    update();
    draw();
    setTimeout(gameLoop, 100);
  }

// Update game state
  function update() {
    // Move snake based on the current direction
    var head = {
      x: snake.body[0].x,
      y: snake.body[0].y
    };
    switch (snake.direction) {
      case "up":
        head.y--;
        break;
      case "down":
        head.y++;
        break;
      case "left":
        head.x--;
        break;
      case "right":
        head.x++;
        break;
    }

// Check for collision with food
    if (head.x === food.x && head.y === food.y) {
      // Increase score
      score++;
      // Create new food
      createFood();
    } else {
      // Remove tail segment
      snake.body.pop();
    }

// Check for collision with walls or snake body
    if (
      head.x < 0 ||
      head.x >= columns ||
      head.y < 0 ||
      head.y >= rows ||
      isSnakeBody(head.x, head.y)
    ) {
      // Game over
      alert("Game over!");
      // Restart game
      init();
      return;
    }

// Add new head segment
    snake.body.unshift(head);
  }

// Draw game on canvas
  function draw() {
    ctx.clearRect(0, 0, canvas.width, canvas.height);

// Draw the snake
    ctx.fillStyle = "green";
    for (var i = 0; i < snake.body.length; i++) {
      var segment = snake.body[i];
      ctx.fillRect(
        segment.x * tileSize,
        segment.y * tileSize,
        tileSize,
        tileSize
      );
    }

// Draw the food
    ctx.fillStyle = "red";
    ctx.fillRect(
      food.x * tileSize,
      food.y * tileSize,
      tileSize,
      tileSize
    );

// Draw the score
    ctx.fillStyle = "black";
    ctx.font = "12px Arial";
    ctx.fillText("Score: " + score, 10, 20);
  }

// Create a random food position
  function createFood() {
    food = {
      x: Math.floor(Math.random() * columns),
      y: Math.floor(Math.random() * rows)
    };
  }

// Check if the given position is part of the snake body
  function isSnakeBody(x, y) {
    for (var i = 0; i < snake.body.length; i++) {
      if (snake.body[i].x === x && snake.body[i].y === y) {
        return true;
      }
    }
    return false;
  }

// Handle arrow key press events to change snake direction
  document.addEventListener("keydown", function(event) {
    switch (event.keyCode) {
      case 38: // Up arrow key
        if (snake.direction !== "down") {
          snake.direction = "up";
        }
        break;
      case 40: // Down arrow key
        if (snake.direction !== "up") {
          snake.direction = "down";
        }
        break;
      case 37: // Left arrow key
        if (snake.direction !== "right") {
          snake.direction = "left";
        }
        break;
      case 39: // Right arrow key
        if (snake.direction !== "left") {
          snake.direction = "right";
        }
        break;
    }
  });

// Initialize the game
  init();
</script>
<canvas id="gameCanvas" width="400" height="400"></canvas>
</body>
</html>
```

Note: This game is a simplified version of the popular Snake.io game and may not have all the features and visuals you might expect from a complete game. Feel free to modify it or add more features to suit your needs.