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

No:17415

Make a digital scale weighing gane
Developer User7431｜Date and time 23/9/23 9:46:22
Build time 32.137 sec｜Game capacity 4.07KB｜

Script

Sure! Here's a simple implementation of a digital scale weighing game using JavaScript and pictograms. Please note that the game logic and styling can be enhanced further, but this should give you a basic starting point.

Digital Scale Weighing Game

Place the pictogram objects on the scale pans to achieve balance.

To play the game: 1. Open any text editor and create a new file. 2. Copy and paste the above code into the file. 3. Save the file with a `.html` extension (e.g., `scale_game.html`). 4. Open the saved file in a web browser on your smartphone or computer. 5. You should now see the digital scale weighing game interface. 6. Tap the 🍎 or 🍌 buttons to place the corresponding pictogram objects on the scale pans. 7. Try to achieve balance between the left and right pans by placing the objects accordingly. Enjoy playing the digital scale weighing game!

←

Prev　Next

→ 　

Back　

[PR]現在の本の売れ筋ランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Digital Scale Weighing Game</title>
  <style>
    body {
      font-family: Arial, sans-serif;
    }
    .container {
      max-width: 500px;
      margin: 0 auto;
      padding: 20px;
      text-align: center;
    }
    button {
      padding: 10px 20px;
      font-size: 16px;
    }
    #scale {
      width: 300px;
      height: 200px;
      margin: 40px auto;
      border: 2px solid #000;
      position: relative;
    }
    #leftPan, #rightPan {
      width: 140px;
      height: 140px;
      background-color: #f2f2f2;
      border-radius: 50%;
      position: absolute;
      bottom: -72px;
      border: 2px solid #000;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    #leftItem, #rightItem {
      width: 50px;
      height: 50px;
      background-color: #ccc;
      border-radius: 50%;
      margin: 0 10px;
    }
    .pictogram {
      font-size: 40px;
    }
    #message {
      font-weight: bold;
      margin-bottom: 20px;
    }
  </style>
</head>
<body>
  <div class="container">
    <h1>Digital Scale Weighing Game</h1>
    <p id="message">Place the pictogram objects on the scale pans to achieve balance.</p>
    <div id="scale">
      <div id="leftPan">
        <div id="leftItem" class="pictogram"></div>
      </div>
      <div id="rightPan">
        <div id="rightItem" class="pictogram"></div>
      </div>
    </div>
    <button onclick="placeObject('apple')" class="pictogram">🍎</button>
    <button onclick="placeObject('banana')" class="pictogram">🍌</button>
    <button onclick="resetGame()">Reset</button>
  </div>

function placeObject(object) {
      // Remove previous objects from the scale pans
      document.getElementById('leftItem').innerHTML = '';
      document.getElementById('rightItem').innerHTML = '';

if (leftWeight === rightWeight) {
        // Reset weights if already balanced
        leftWeight = 0;
        rightWeight = 0;
        document.getElementById('message').innerText = "Place the pictogram objects on the scale pans to achieve balance.";
      } else {
        // Calculate new weights
        if (leftWeight < rightWeight) {
          leftWeight++;
          document.getElementById('leftItem').innerHTML = object;
          document.getElementById('message').innerText = "Left pan is lighter!";
        } else {
          rightWeight++;
          document.getElementById('rightItem').innerHTML = object;
          document.getElementById('message').innerText = "Right pan is lighter!";
        }

// Check if balanced
        if (leftWeight === rightWeight) {
          document.getElementById('message').innerText = "Balanced!";
        }
      }
    }

function resetGame() {
      leftWeight = 0;
      rightWeight = 0;
      document.getElementById('leftItem').innerHTML = '';
      document.getElementById('rightItem').innerHTML = '';
      document.getElementById('message').innerText = "Place the pictogram objects on the scale pans to achieve balance.";
    }
  </script>
</body>
</html>
```

To play the game:
1. Open any text editor and create a new file.
2. Copy and paste the above code into the file.
3. Save the file with a `.html` extension (e.g., `scale_game.html`).
4. Open the saved file in a web browser on your smartphone or computer.
5. You should now see the digital scale weighing game interface.
6. Tap the 🍎 or 🍌 buttons to place the corresponding pictogram objects on the scale pans.
7. Try to achieve balance between the left and right pans by placing the objects accordingly.

Enjoy playing the digital scale weighing game!