Rainbow-colored neon illumination's game

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

No:5466

4077

←

Prev Next

→

Rainbow-colored neon illumination
Developer User3694｜Date and time 23/6/30 3:21:40
Build time 30.887 sec｜Game capacity 2.722KB｜

Script

了解です。以下に、スマートフォンで遊べるシンプルなゲームを作成します。このゲームでは、虹色のネオンのイルミネーションを楽しむことができます。

このゲームでは、虹色のネオンが画面上をランダムに動きながら光るイルミネーションを作成します。ゲーム画面全体にディスプレイを作成し、JavaScriptを使用して虹色のネオン要素を追加しています。ネオンはアニメーションされ、ランダムな位置で点滅するようになっています。このHTMLファイルをブラウザで開くと、スマートフォンで操作可能なゲームとして楽しむことができます。ご希望の虹色のイルミネーションをお楽しみください。

←

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>
    /* ゲーム画面全体を覆うディスプレイ */
    #game-display {
      width: 100%;
      height: 100%;
      position: fixed;
      top: 0;
      left: 0;
      background-color: black;
      overflow: hidden;
    }

/* 虹色のネオン */
    .neon {
      width: 150px;
      height: 150px;
      position: absolute;
      border-radius: 50%;
      animation: neon-animation 2s infinite linear;
    }

@keyframes neon-animation {
      0% {
        box-shadow: 0 0 30px red;
      }
      20% {
        box-shadow: 0 0 30px orange;
      }
      40% {
        box-shadow: 0 0 30px yellow;
      }
      60% {
        box-shadow: 0 0 30px lime;
      }
      80% {
        box-shadow: 0 0 30px blue;
      }
      100% {
        box-shadow: 0 0 30px violet;
      }
    }
  </style>
</head>
<body>
  <div id="game-display"></div>

// ゲーム画面の幅と高さを取得
      const width = gameDisplay.offsetWidth;
      const height = gameDisplay.offsetHeight;

for (let i = 0; i < 50; i++) {
        // 虹色のネオン要素を作成
        const neon = document.createElement('div');
        neon.classList.add('neon');

// ランダムな位置に配置
        const x = Math.random() * width;
        const y = Math.random() * height;
        neon.style.left = x + 'px';
        neon.style.top = y + 'px';

// ネオンをゲーム画面に追加
        gameDisplay.appendChild(neon);
      }
    }

// ゲームを開始する関数
    function startGame() {
      createAnimation();
    }

// ゲームを開始
    startGame();
  </script>
</body>
</html>
```

このゲームでは、虹色のネオンが画面上をランダムに動きながら光るイルミネーションを作成します。ゲーム画面全体にディスプレイを作成し、JavaScriptを使用して虹色のネオン要素を追加しています。ネオンはアニメーションされ、ランダムな位置で点滅するようになっています。

このHTMLファイルをブラウザで開くと、スマートフォンで操作可能なゲームとして楽しむことができます。ご希望の虹色のイルミネーションをお楽しみください。