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

No:15945

167

←

Prev Next

→

По физической силе? По разрушительному потенциалу?..ALL
Developer User6992｜Date and time 23/9/14 1:56:16
Build time 32.591 sec｜Game capacity 2.905KB｜

Script

Below is a single HTML file containing a simple game using pictograms and JavaScript. The game allows the player to choose different attributes to determine the strength of a character. The player can then see the character's overall power level based on their chosen attributes.

Character Power Game

Choose Character Attributes:

Physical Strength

Destructive Power

Mobility

In this game, the player can choose the character attributes using the pictograms displayed on the screen. Each attribute has three levels represented by different pictograms. The player can click on an attribute image to select it. The power level of the character is calculated by summing up the levels of all selected attributes. The result is displayed dynamically on the screen. Note: Please replace the `emozi_hamuster.png` image paths with the actual image URLs or file paths.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
  <title>Character Power Game</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
    }
    
    img {
      width: 50px;
    }
  </style>
</head>
<body>
  <h1>Character Power Game</h1>
  
  <div id="power-level"></div>
  
  <h2>Choose Character Attributes:</h2>
  
  <div>
    <h3>Physical Strength</h3>
    <img src="pictogram1.png" alt="physical strength" class="attribute" data-level="5">
    <img src="pictogram2.png" alt="physical strength" class="attribute" data-level="10">
    <img src="pictogram3.png" alt="physical strength" class="attribute" data-level="15">
  </div>
  
  <div>
    <h3>Destructive Power</h3>
    <img src="pictogram4.png" alt="destructive power" class="attribute" data-level="3">
    <img src="pictogram5.png" alt="destructive power" class="attribute" data-level="8">
    <img src="pictogram6.png" alt="destructive power" class="attribute" data-level="12">
  </div>
  
  <div>
    <h3>Mobility</h3>
    <img src="pictogram7.png" alt="mobility" class="attribute" data-level="6">
    <img src="pictogram8.png" alt="mobility" class="attribute" data-level="11">
    <img src="pictogram9.png" alt="mobility" class="attribute" data-level="14">
  </div>
  
  <script>
    // Get all attribute images
    const attributeImages = document.querySelectorAll('.attribute');

// Set event listener for attribute selection
    attributeImages.forEach(image => {
      image.addEventListener('click', () => calculatePowerLevel());
    });
    
    // Function to calculate and display power level
    function calculatePowerLevel() {
      let totalPower = 0;
      
      // Loop through all attribute images
      attributeImages.forEach(image => {
        if (image.classList.contains('selected')) {
          // Add attribute level to total power
          totalPower += Number(image.getAttribute('data-level'));
        }
      });
      
      // Display power level
      const powerLevelDiv = document.getElementById('power-level');
      powerLevelDiv.textContent = `Power Level: ${totalPower}`;
    }
  </script>
</body>
</html>
```

The power level of the character is calculated by summing up the levels of all selected attributes. The result is displayed dynamically on the screen.

Note: Please replace the `pictogramX.png` image paths with the actual image URLs or file paths.