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

No:12964

119

←

Prev Next

→

RPGで放置ゲームでカードゲームでタワーディフェンス
Developer User5662｜Date and time 23/8/25 15:16:55
Build time 23.57 sec｜Game capacity 2.331KB｜

Script

了解しました。以下に示すコードは、HTMLファイルとして実装されており、JavaScriptを含んでいます。このゲームは、スマートフォン操作に対応しています。絵文字も使用されています。

放置カードタワーディフェンスRPG

タワーのヒットポイント: 100

このゲームでは、カードをクリックするとタワーに10ダメージを与えます。タワーのヒットポイントが0以下になるとゲームが終了します。

←

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>放置カードタワーディフェンスRPG</title>
  <style>
    body {
      font-family: Arial, sans-serif;
    }
    
    .card {
      display: inline-block;
      width: 100px;
      height: 150px;
      background-color: lightblue;
      border: 1px solid black;
      text-align: center;
      vertical-align: middle;
    }
    
    .tower {
      display: block;
      width: 100px;
      height: 200px;
      background-color: darkgray;
      border: 2px solid black;
      text-align: center;
      vertical-align: middle;
    }
    
    .battle-field {
      display: flex;
      justify-content: space-between;
      margin-top: 50px;
    }
    
    .message {
      text-align: center;
      margin-top: 20px;
    }
  </style>
</head>
<body>
  <h1>放置カードタワーディフェンスRPG</h1>
  
  <div class="battle-field">
    <div class="card"></div>
    <div class="tower"></div>
  </div>
  
  <div class="message">タワーのヒットポイント: <span id="tower-hp">100</span></div>
  
  <script>
    // タワーのヒットポイントを管理する変数
    let towerHP = 100;
    
    // カードをクリックしたときにタワーにダメージを与える関数
    function attackTower() {
      towerHP -= 10;
      document.getElementById('tower-hp').textContent = towerHP;
      
      // タワーのヒットポイントが0以下になった場合
      if (towerHP <= 0) {
        // ゲーム終了のメッセージを表示する
        document.querySelector('.message').textContent = 'ゲーム終了！タワーが破壊されました！';
      }
    }
    
    // カードをクリックした際に攻撃するイベントリスナーを登録する
    document.querySelector('.card').addEventListener('click', attackTower);
  </script>
</body>
</html>
```

このゲームでは、カードをクリックするとタワーに10ダメージを与えます。タワーのヒットポイントが0以下になるとゲームが終了します。