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

No:8092

2674

←

Prev Next

→

2048 merge ball numbers you drop balls in a box pl..ALL
Developer User4131｜Date and time 23/7/12 23:21:31
Build time 27.827 sec｜Game capacity 4.022KB｜

Script

Sure! Here's a sample implementation of a simplified version of the game "2048" using JavaScript and HTML:

2048 Merge Ball Numbers

Score: 0

This is a simplified implementation of the "2048" game where you drop balls with numbers into a box. You can play the game by using the arrow keys on your keyboard to move the balls. The objective is to merge balls with the same numbers to form larger numbers and reach the number 2048. Note: This is a basic implementation, and the logic for merging tiles based on the arrow key pressed is not included. You would need to implement that part according to the game rules.

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

Sure! Here's a sample implementation of a simplified version of the game "2048" using JavaScript and HTML:

```html
<!DOCTYPE html>
<html>
<head>
  <title>2048 Merge Ball Numbers</title>
  <style>
    body {
      text-align: center;
      font-family: Arial, sans-serif;
    }

.game-board {
      display: inline-block;
      border: 2px solid #000;
      margin-top: 20px;
      padding: 10px;
    }

.cell {
      display: inline-block;
      width: 50px;
      height: 50px;
      border: 1px solid #000;
      margin: 2px;
      line-height: 50px;
      font-size: 20px;
    }

#score {
      margin-top: 10px;
    }

.btn {
      background-color: #4CAF50;
      color: white;
      padding: 10px 24px;
      text-align: center;
      text-decoration: none;
      display: inline-block;
      font-size: 16px;
      margin: 10px;
      cursor: pointer;
      border: none;
    }
  </style>
</head>
<body>
  <h1>2048 Merge Ball Numbers</h1>
  <div class="game-board"></div>
  <div id="score">Score: <span id="score-value">0</span></div>
  <button class="btn" onclick="startGame()">New Game</button>

// Initialize the game
    function startGame() {
      board = [[0, 0, 0, 0], [0, 0, 0, 0], [0, 0, 0, 0], [0, 0, 0, 0]];
      score = 0;
      addNewBall();
      updateBoard();
    }

// Add a new ball to the board
    function addNewBall() {
      var emptyCells = [];
      for (var i = 0; i < 4; i++) {
        for (var j = 0; j < 4; j++) {
          if (board[i][j] === 0) {
            emptyCells.push({ row: i, col: j });
          }
        }
      }
      if (emptyCells.length > 0) {
        var randomCell = emptyCells[Math.floor(Math.random() * emptyCells.length)];
        board[randomCell.row][randomCell.col] = Math.random() > 0.5 ? 2 : 4;
      }
    }

// Update the game board
    function updateBoard() {
      var gameBoard = document.querySelector('.game-board');
      gameBoard.innerHTML = '';
      for (var i = 0; i < 4; i++) {
        for (var j = 0; j < 4; j++) {
          var cell = document.createElement('div');
          cell.className = 'cell';
          cell.textContent = board[i][j] !== 0 ? board[i][j] : '';
          cell.style.backgroundColor = getCellColor(board[i][j]);
          gameBoard.appendChild(cell);
        }
      }
      document.getElementById('score-value').textContent = score;
    }

// Get background color for a cell based on its value
    function getCellColor(value) {
      switch (value) {
        case 2: return '#eee4da';
        case 4: return '#ede0c8';
        case 8: return '#f2b179';
        case 16: return '#f59563';
        case 32: return '#f67c5f';
        case 64: return '#f65e3b';
        case 128: return '#edcf72';
        case 256: return '#edcc61';
        case 512: return '#9c0';
        case 1024: return '#33b5e5';
        case 2048: return '#09c';
        default: return '#ccc0b3';
      }
    }

// Handle keyboard arrow key events
    document.addEventListener('keydown', function(event) {
      if (event.keyCode === 37 || event.keyCode === 38 || event.keyCode === 39 || event.keyCode === 40) {
        event.preventDefault();
        moveTiles(event.keyCode);
      }
    });

// Move the tiles based on the arrow key pressed
    function moveTiles(keyCode) {
      // Your logic for moving the tiles based on the arrow key pressed goes here
      // ...
      addNewBall();
      updateBoard();
    }

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

Note: This is a basic implementation, and the logic for merging tiles based on the arrow key pressed is not included. You would need to implement that part according to the game rules.