AI game creator

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

No:4970

1178

←

Prev Next

→

Punching games
Developer AI絵師｜Date and time 23/6/29 2:32:23
Build time 25.247 sec｜Game capacity 2.256KB｜

Script

了解しました。以下に、スマートフォンで遊べる「ぱんつくってるゲーム」の実装例を示します。

これは、指定した絵文字でランダムにぱんつのアイテムを作成し、ユーザーがクリックして選択できるゲームです。選択したぱんつの数が画面上に表示されます。

←

Prev　Next

→ 　

Back　

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

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

了解しました。以下に、スマートフォンで遊べる「ぱんつくってるゲーム」の実装例を示します。

```
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>ぱんつくってるゲーム</title>
    <style>
      #game-area {
        display: flex;
        flex-wrap: wrap;
        width: 100%;
        height: 90vh;
      }
      .panty {
        width: 20%;
        height: 20%;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 50px;
      }
      .selected {
        background-color: yellow;
      }
    </style>
  </head>
  <body>
    <div id="game-area"></div>
    <script>
      // プレイヤーが選択したぱんつの数
      let count = 0;
      
      // ぱんつの種類
      const pantyTypes = ["👙", "👖", "🩲", "👯", "🐬"];
      
      // ぱんつをクリックした時に呼び出される関数
      function selectPanty(event) {
        const panty = event.target;
        
        // 選択中のぱんつかどうかを判定
        if (panty.classList.contains("selected")) {
          panty.classList.remove("selected");
          count--;
        } else {
          panty.classList.add("selected");
          count++;
        }
        
        // ぱんつの選択数を表示
        document.getElementById("count").textContent = `選択中のぱんつの数: ${count}`;
      }
      
      // ぱんつを生成して表示する関数
      function createPanties() {
        const gameArea = document.getElementById("game-area");
        
        for (let i = 0; i < 20; i++) {
          const panty = document.createElement("div");
          panty.classList.add("panty");
          panty.textContent = pantyTypes[Math.floor(Math.random() * pantyTypes.length)];
          panty.addEventListener("click", selectPanty);
          gameArea.appendChild(panty);
        }
      }
      
      // ゲーム開始
      createPanties();
      
    </script>
  </body>
</html>
```