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

No:51696

211

←

Prev Next

→

Merge Game
Developer User18914｜Date and time 24/3/15 2:43:42
Build time 9.38 sec｜Game capacity 2.024KB｜

Script

Merge Game

Your goal is to merge the tiles to get the highest score!

Score: 0

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
<head>
  <title>Merge Game</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
    }
    #score {
      font-size: 20px;
      margin-bottom: 20px;
    }
    #container {
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
    }
    .tile {
      width: 50px;
      height: 50px;
      background-color: #f5f5f5;
      margin: 5px;
      border-radius: 5px;
      display: flex;
      justify-content: center;
      align-items: center;
      font-size: 20px;
    }
  </style>
</head>
<body>
  <h1>Merge Game</h1>
  <p>Your goal is to merge the tiles to get the highest score!</p>
  
  <div id="score">Score: 0</div>
  
  <div id="container"></div>
  
  <script>
    // Initial variables
    let score = 0;
    let tiles = [];

// Function to generate a random tile
    function generateRandomTile() {
      const value = Math.random() < 0.5 ? 2 : 4;
      const tile = document.createElement('div');
      tile.className = 'tile';
      tile.textContent = value;
      return tile;
    }

// Function to add a new tile to the grid
    function addNewTile() {
      const tile = generateRandomTile();
      tiles.push(tile);
      document.getElementById('container').appendChild(tile);
    }

// Function to merge tiles
    function mergeTiles() {
      for (let i = 0; i < tiles.length - 1; i++) {
        if (tiles[i].textContent === tiles[i + 1].textContent) {
          const newValue = parseInt(tiles[i].textContent) * 2;
          tiles[i].textContent = newValue;
          tiles[i + 1].remove();
          tiles.splice(i + 1, 1);
          score += newValue;
        }
      }
      document.getElementById('score').textContent = `Score: ${score}`;
    }

// Event listener for merging tiles
    document.addEventListener('keydown', function(event) {
      if (event.key === 'ArrowUp') {
        mergeTiles();
      }
    });

// Start the game
    addNewTile();
    addNewTile();
  </script>
</body>
</html>