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

No:34947

120

←

Prev Next

→

My singing monsters
Developer User9721｜Date and time 24/1/12 21:18:59
Build time 11.416 sec｜Game capacity 2.246KB｜

Script

Sure! Here's an example of a simple game based on My Singing Monsters implemented in a single HTML file using JavaScript and pictograms:

Welcome to My Singing Monsters Game!

Click on the pictograms to create your own monster orchestra!

In this game, you can select and deselect different monsters by clicking on their pictograms. The selected monsters will be highlighted with a blue border. A message will be displayed when at least one monster is selected.

←

Prev　Next

→ 　

Back　

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

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

Sure! Here's an example of a simple game based on My Singing Monsters implemented in a single HTML file using JavaScript and pictograms:

```html
<!DOCTYPE html>
<html>
<head>
  <title>My Singing Monsters Game</title>
  <style>
    #message {
      font-size: 24px;
      text-align: center;
      margin-top: 100px;
      display: none;
    }

#pictogram-container {
      text-align: center;
    }

.pictogram {
      width: 100px;
      height: 100px;
      margin: 20px;
      display: inline-block;
      cursor: pointer;
    }
  </style>
</head>
<body>
  <h1>Welcome to My Singing Monsters Game!</h1>
  
  <div id="message">Click on the pictograms to create your own monster orchestra!</div>
  
  <div id="pictogram-container">
    <img src="monster1.png" class="pictogram" id="monster1">
    <img src="monster2.png" class="pictogram" id="monster2">
    <img src="monster3.png" class="pictogram" id="monster3">
    <img src="monster4.png" class="pictogram" id="monster4">
  </div>

// Function to handle pictogram click event
    function selectMonster() {
      const monsterId = this.id;
      
      if (selectedMonsters.includes(monsterId)) {
        // Monster already selected, deselect it
        const index = selectedMonsters.indexOf(monsterId);
        selectedMonsters.splice(index, 1);
        this.style.border = "";
      } else {
        // Monster not selected, select it
        selectedMonsters.push(monsterId);
        this.style.border = "2px solid blue";
      }
      
      if (selectedMonsters.length > 0) {
        message.style.display = "block";
      } else {
        message.style.display = "none";
      }
    }

// Attach event listeners to pictograms
    for (let i = 0; i < pictograms.length; i++) {
      pictograms[i].addEventListener('click', selectMonster);
    }
  </script>
</body>
</html>
```