星を滅ぼすゲーム's game | AI game creator

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

No:25538

166

星を滅ぼすゲーム
Developer User12383｜Date and time 23/11/22 22:30:31
Build time 99.569 sec｜Game capacity 3.276KB｜

了解の返事は不要ですが、以下に星を滅ぼすゲームの実装例を示します。このゲームでは、ボタンを押すことで星がランダムに出現し、タップすることで星を消すことができます。ゲームの目的は、制限時間内にできるだけ多くの星を消すことです。

このHTMLファイルをブラウザで開くことで、星を滅ぼすゲームが遊べるようになります。最初に「スタート」ボタンを押すと、制限時間内で星をできるだけ多く消していくことができます。制限時間終了後には、スコアが表示され、再度「スタート」ボタンを押すことでゲームを再開できます。なお、この実装では絵文字「★」を星の形として使用していますが、ブラウザによっては表示されない場合があるため、文字の代わりに絵や画像を使用するなど、他の方法を検討することもできます。

→ 　

0　

0　

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

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

(C)2023 HisashiApp

了解の返事は不要ですが、以下に星を滅ぼすゲームの実装例を示します。このゲームでは、ボタンを押すことで星がランダムに出現し、タップすることで星を消すことができます。ゲームの目的は、制限時間内にできるだけ多くの星を消すことです。

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>星を滅ぼすゲーム</title>
  <style>
    body {
      background-color: #000;
      text-align: center;
      margin: 0;
      font-size: 32px;
      color: #fff;
      overflow: hidden;
    }
    #game-container {
      width: 100%;
      height: 100%;
      position: relative;
    }
    .star {
      position: absolute;
      top: 0;
      left: 0;
      width: 50px;
      height: 50px;
      line-height: 50px;
      text-align: center;
      font-size: 30px;
      cursor: pointer;
      opacity: 1;
      transition-property: opacity;
      transition-duration: 0.2s;
    }
  </style>
</head>
<body>
  <div id="game-container">
    <button id="start-button">スタート</button>
  </div>

<script>
    var gameContainer = document.getElementById('game-container');
    var startButton = document.getElementById('start-button');
    var score = 0;
    var time = 10;
    var intervalId;

startButton.addEventListener('click', startGame);

function startGame() {
      startButton.style.display = 'none';
      score = 0;
      time = 10;
      gameContainer.addEventListener('click', removeStar);
      intervalId = setInterval(createStar, 1000);
      updateDisplay();
      setTimeout(endGame, 10000);
    }
    
    function removeStar(event) {
      if (event.target.classList.contains('star')) {
        event.target.parentNode.removeChild(event.target);
        score++;
        updateDisplay();
      }
    }

function createStar() {
      var star = document.createElement('div');
      star.classList.add('star');
      star.innerText = '★';
      star.style.top = Math.floor(Math.random() * (window.innerHeight - 50)) + 'px';
      star.style.left = Math.floor(Math.random() * (window.innerWidth - 50)) + 'px';
      gameContainer.appendChild(star);
    }

function updateDisplay() {
      gameContainer.innerText = 'Score: ' + score + ' | Time: ' + time;
    }
    
    function endGame() {
      clearInterval(intervalId);
      gameContainer.removeEventListener('click', removeStar);
      gameContainer.innerHTML = '<h1>ゲーム終了</h1><p>Score: ' + score + '</p>';
      startButton.style.display = 'block';
    }
  </script>
</body>
</html>
```

このHTMLファイルをブラウザで開くことで、星を滅ぼすゲームが遊べるようになります。最初に「スタート」ボタンを押すと、制限時間内で星をできるだけ多く消していくことができます。制限時間終了後には、スコアが表示され、再度「スタート」ボタンを押すことでゲームを再開できます。

なお、この実装では絵文字「★」を星の形として使用していますが、ブラウザによっては表示されない場合があるため、文字の代わりに絵や画像を使用するなど、他の方法を検討することもできます。