Matsuo Bashos willow slowly descends from the top of the screen.'s game

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

No:4733

2406

←

Prev Next

→

Matsuo Bashos willow slowly descends from the top ..ALL
Developer User3795｜Date and time 23/6/28 18:57:44
Build time 22.98 sec｜Game capacity 1.934KB｜

Script

了解しました。以下に松尾芭蕉の川柳が画面の上からゆっくりと降ってくる簡単なゲームの実装例を示します。

このプログラムでは、指定した川柳のリストからランダムに川柳を選び、画面の上から下にゆっくりと落下させます。一定時間ごとに新しい川柳が生成され、繰り返し落下します。スマートフォン上でも操作が可能です。

←

Prev　Next

→ 　

Back　

[PR]現在の人気グッズランキング

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

了解しました。以下に松尾芭蕉の川柳が画面の上からゆっくりと降ってくる簡単なゲームの実装例を示します。

```html
<!DOCTYPE html>
<html>
<head>
  <title>松尾芭蕉の川柳</title>
  <style>
    body {
      overflow: hidden;
    }
    .falling-poem {
      position: absolute;
      top: -30px;
      color: black;
      font-size: 20px;
    }
  </style>
</head>
<body>
  <script>
    // 川柳のリスト
    const poems = [
      "古池や",
      "蛙飛びこむ",
      "水の音",
      "おはよう",
      "すみません",
      "さようなら"
    ];

// ランダムに川柳を選択
    function getRandomPoem() {
      const index = Math.floor(Math.random() * poems.length);
      return poems[index];
    }

// 落下する川柳の要素を作成
    function createFallingPoem() {
      const poem = document.createElement("div");
      poem.classList.add("falling-poem");
      poem.textContent = getRandomPoem();
      poem.style.left = Math.random() * (window.innerWidth - 100) + "px";
      return poem;
    }

// 川柳の落下アニメーション
    function animateFallingPoems() {
      const poem = createFallingPoem();
      document.body.appendChild(poem);

let top = -30;
      const intervalId = setInterval(() => {
        top += 1;
        poem.style.top = top + "px";

if (top >= window.innerHeight) {
          poem.remove();
          clearInterval(intervalId);
        }
      }, 50);
    }

// 一定間隔で川柳を落下させる
    setInterval(animateFallingPoems, 1000);
  </script>
</body>
</html>
```

このプログラムでは、指定した川柳のリストからランダムに川柳を選び、画面の上から下にゆっくりと落下させます。一定時間ごとに新しい川柳が生成され、繰り返し落下します。スマートフォン上でも操作が可能です。