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

No:9688

120

←

Prev Next

→

alligator panic
Developer User4369｜Date and time 23/7/26 20:47:26
Build time 19.878 sec｜Game capacity 2.265KB｜

Script

了解です。以下に、ワニワニパニックのゲームを実装したHTMLファイルを示します。

ワニワニパニック

このゲームでは、ワニの絵文字を表示し、ユーザーがワニをクリックすることでスコアを上げます。残り時間が0になるとゲーム終了となり、スコアが表示されます。ゲームスタートボタンを押すとゲームがスタートします。画面上でのワニの表示位置や終了までの時間はランダムです。

←

Prev　Next

→ 　

Back　

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

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

了解です。以下に、ワニワニパニックのゲームを実装したHTMLファイルを示します。

```html
<!DOCTYPE html>
<html>
<head>
  <title>ワニワニパニック</title>
  <style>
    .container {
      display: flex;
      justify-content: center;
      align-items: center;
      height: 100vh;
    }
  </style>
</head>
<body>
  <div class="container">
    <h1>ワニワニパニック</h1>
    <button onclick="startGame()">ゲームスタート</button>
    <br><br>
    <div id="gameArea"></div>
  </div>

function startGame() {
      gameArea.innerHTML = '';
      score = 0;
      time = 30;
      showScore();
      showTime();
      createCrocodile();
      countdown();
    }

function showScore() {
      gameArea.innerHTML += `<p>スコア: ${score}</p>`;
    }

function showTime() {
      gameArea.innerHTML += `<p>残り時間: ${time}秒</p>`;
    }

function createCrocodile() {
      const crocodile = document.createElement('div');
      crocodile.innerHTML = '🐊';
      crocodile.style.fontSize = '60px';
      crocodile.style.position = 'absolute';
      crocodile.style.left = Math.floor(Math.random() * (window.innerWidth - 100)) + 'px';
      crocodile.style.top = Math.floor(Math.random() * (window.innerHeight - 100)) + 'px';
      crocodile.addEventListener('click', () => {
        score++;
        showScore();
        crocodile.remove();
        createCrocodile();
      });
      gameArea.appendChild(crocodile);
    }