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

No:23764

←

Prev Next

→

Make a evolution game
Developer User11133｜Date and time 23/11/3 12:33:39
Build time 74.857 sec｜Game capacity 2.714KB｜

Script

Sure! Here's a simple evolution game implemented as a single HTML file using JavaScript and enclosed in script tags. The game allows you to evolve cute animals by clicking on them. The evolution process is represented by changing pictograms. The game is designed to be played on a smartphone.

Evolution Game

🐣

🐍

🐰

🦊

🐺

🐵

In the above code, there are six different animals represented by pictograms (`🐣`, `🐍`, `🐰`, `🦊`, `🐺`, `🐵`). Each animal has an initial level of evolution (represented by the pictograms) and can be evolved by clicking on it. Clicking on an animal will change its pictogram to the next evolution level in the `evolutionLevels` array. Please note that this is a simplified implementation to give you an idea of how an evolution game can be created using JavaScript and HTML. You can modify and enhance the game further according to your requirements.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームアプリランキング

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

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Evolution Game</title>
  <style>
    body {
      font-family: Arial, sans-serif;
      text-align: center;
    }

h1 {
      color: #00bfff;
    }

#container {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      margin-top: 50px;
    }

.animal {
      margin: 10px;
      width: 200px;
      height: 200px;
      border-radius: 50%;
      background-color: #ccc;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      font-size: 48px;
    }
  </style>
</head>
<body>
  <h1>Evolution Game</h1>
  <div id="container">
    <div id="animal1" class="animal">🐣</div>
    <div id="animal2" class="animal">🐍</div>
    <div id="animal3" class="animal">🐰</div>
    <div id="animal4" class="animal">🦊</div>
    <div id="animal5" class="animal">🐺</div>
    <div id="animal6" class="animal">🐵</div>
  </div>

function evolveAnimal(animalId) {
      let animal = document.getElementById(animalId);
      let currentEvolutionLevel = animal.innerHTML;
      let indexOfCurrentLevel = evolutionLevels.indexOf(currentEvolutionLevel);
      
      // Check if animal can evolve to the next level
      if (indexOfCurrentLevel < evolutionLevels.length - 1) {
        let nextEvolutionLevel = evolutionLevels[indexOfCurrentLevel + 1];
        animal.innerHTML = nextEvolutionLevel;
      }
    }

// Attach click event listeners to all animals
    let animals = document.getElementsByClassName("animal");
    for (let i = 0; i < animals.length; i++) {
      animals[i].addEventListener("click", function() {
        evolveAnimal(this.id);
      });
    }
  </script>
</body>
</html>
```

Please note that this is a simplified implementation to give you an idea of how an evolution game can be created using JavaScript and HTML. You can modify and enhance the game further according to your requirements.