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

No:1563

1910

←

Prev Next

→

penguin scooping (festival game)
Developer sayaensm｜Date and time 23/6/18 18:36:13
Build time 14.553 sec｜Game capacity 1.396KB｜

Script

ペンギンすくい

Score: 0

🐧
ペンギンをクリックすると1点加算され、画面内を移動するようになっています。1秒ごとにランダムな場所に移動するようにも設定しています。スコアの表示を設置し、スマホの場合も遊びやすいように大きめの絵文字を使用しています。

←

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>
      .penguin {
        font-size: 100px;
        cursor: pointer;
      }
    </style>
    <script>
      let score = 0;
      function catchPenguin() {
        score++;
        document.getElementById("score").innerHTML = "Score: " + score;
        movePenguin();
      }
      function movePenguin() {
        let penguin = document.getElementById("penguin");
        let x = Math.floor(Math.random() * window.innerWidth);
        let y = Math.floor(Math.random() * window.innerHeight);
        penguin.style.left = x + "px";
        penguin.style.top  = y + "px";
      }
      document.addEventListener("DOMContentLoaded", () => {
        movePenguin();
        setInterval(movePenguin, 3000);
        document.getElementById("penguin").addEventListener("click", catchPenguin);
      });
    </script>
  </head>
  <body>
    <h1>ペンギンすくい</h1>
    <p id="score">Score: 0</p>
    <span id="penguin" class="penguin">🐧</span>
  </body>
</html>

ペンギンをクリックすると1点加算され、画面内を移動するようになっています。1秒ごとにランダムな場所に移動するようにも設定しています。スコアの表示を設置し、スマホの場合も遊びやすいように大きめの絵文字を使用しています。