Crie um jogo matemático estilo Zuma's game

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

No:20313

←

Prev Next

→

Crie um jogo matemático estilo Zuma
Developer User9013｜Date and time 23/10/9 4:56:25
Build time 10.589 sec｜Game capacity 1.977KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

<!DOCTYPE html>
<html>
<head>
  <title>Zuma Game</title>
  <style>
    body {
      font-family: Arial, sans-serif;
    }
    #game-container {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
    }
    #zuma-board {
      display: flex;
      flex-wrap: wrap;
      width: 400px;
      height: 400px;
      border: 1px solid #000;
      margin: 0 auto;
    }
    .pictogram {
      display: flex;
      justify-content: center;
      align-items: center;
      width: 32px;
      height: 32px;
      font-size: 20px;
      margin: 2px;
      border-radius: 50%;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <div id="game-container">
    <div id="zuma-board"></div>
  </div>

var colors = ["red", "blue", "green"]; // Available colors for balls

// Generate a random pictogram
    function generateBall() {
      var randomColor = colors[Math.floor(Math.random() * colors.length)];
      return `<div class="pictogram" style="background-color: ${randomColor}">${randomColor.charAt(0).toUpperCase()}</div>`;
    }

// Add a new ball to the board
    function addBall() {
      var newBall = document.createElement("div");
      newBall.innerHTML = generateBall();

// Click event handler for ball removal
      newBall.addEventListener("click", function() {
        zumaBoard.removeChild(newBall);
        balls = balls.filter(function(ball) {
          return ball !== newBall;
        });
      });

balls.push(newBall);
      zumaBoard.appendChild(newBall);
    }

// Start the game by adding initial balls
    function startGame() {
      for (var i = 0; i < 10; i++) {
        addBall();
      }
    }

// Game loop to continuously add new balls
    setInterval(function() {
      addBall();
    }, 1500);

startGame();
  </script>
</body>
</html>