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

No:3994

622

←

Prev Next

→

Evolutionary Treasures
Developer User3694｜Date and time 23/6/27 1:44:19
Build time 26.321 sec｜Game capacity 2.508KB｜

Script

は、スマホ上で遊べるシンプルなカードゲームを作ってみました。 HTMLファイルの中に、以下のようなJavaScriptコードを記述しました。

進化の秘宝

カードを引いてください

このコードでは、8種類のカードを準備して、画面上の「カードを引く」ボタンを押すと、順番にカードを表示していく形式のゲームを作りました。カードが8枚目まで表示されたら「ゲームクリア！」と表示し、カードを引くボタンを無効にします。リセットボタンを押すと、カードを初期状態に戻します。このゲームはスマホでも遊びやすく、絵文字を使ったシンプルなデザインになっています。

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

は、スマホ上で遊べるシンプルなカードゲームを作ってみました。

HTMLファイルの中に、以下のようなJavaScriptコードを記述しました。

```html
<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <title>進化の秘宝</title>
  <style>
    body {
      font-size: 48px;
      text-align: center;
    }

button {
      font-size: 32px;
      padding: 16px;
      margin: 16px;
    }
  </style>
</head>

<body>
  <h1>進化の秘宝</h1>
  <p id="message">カードを引いてください</p>
  <div>
    <button id="draw-card">カードを引く</button>
    <button id="reset">リセット</button>
  </div>

document.getElementById('reset').addEventListener('click', () => {
      cardIndex = 0;
      Array.from(document.querySelectorAll('[id^="card-"]')).forEach(cardElement => {
        cardElement.remove();
      });
      document.getElementById('message').textContent = 'カードを引いてください';
      document.getElementById('draw-card').disabled = false;
    });
  </script>
</body>

</html>
```

このコードでは、8種類のカードを準備して、画面上の「カードを引く」ボタンを押すと、順番にカードを表示していく形式のゲームを作りました。

カードが8枚目まで表示されたら「ゲームクリア！」と表示し、カードを引くボタンを無効にします。リセットボタンを押すと、カードを初期状態に戻します。

このゲームはスマホでも遊びやすく、絵文字を使ったシンプルなデザインになっています。