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

No:7749

4086

←

Prev Next

→

100 colors indicate light
Developer anonymous｜Date and time 70/1/1 9:55:37
Build time unknown sec｜Game capacity 3.337KB｜

Script

以下は、100色の表示灯を持つシンプルなゲームの実装例です。プレイヤーは表示される色の順番を覚え、覚えた通りにタップするというゲームです。

100色表示灯

このゲームでは、まず「ゲームスタート」ボタンを押すと、100個のランダムな色を持つ表示灯が表示されます。表示灯は2秒後に消えるので、プレイヤーは表示される色の順番を覚えます。その後、順番通りに表示灯をタップしていくことでゲームが進行します。全ての色を正しくタップするとクリアですが、1つでも間違えた場合はゲームオーバーとなります。ご参考までに、上記のコードをコピーしてhtmlファイルに貼り付けて実行してみてください。

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>100色表示灯</title>
</head>
<body>
    <h1>100色表示灯</h1>
    <button id="startButton" onclick="startGame()">ゲームスタート</button>
    <div id="lightContainer"></div>

function startGame() {
            generateLightColors();
            showLightColors();
        }

function generateLightColors() {
            for (var i = 0; i < 100; i++) {
                var randomColor = getRandomColor();
                lightColors.push(randomColor);
            }
        }

function showLightColors() {
            var container = document.getElementById("lightContainer");
            container.innerHTML = "";

for (var i = 0; i < lightColors.length; i++) {
                var light = document.createElement("div");
                light.className = "light";
                light.style.backgroundColor = lightColors[i];
                container.appendChild(light);
            }

currentIndex = 0;
            setTimeout(hideLightColors, 2000);
        }

function hideLightColors() {
            var lights = document.getElementsByClassName("light");

for (var i = 0; i < lights.length; i++) {
                lights[i].style.backgroundColor = "";
            }
        }

function tapLightColor(color) {
            var correctColor = lightColors[currentIndex];

if (color === correctColor) {
                currentIndex++;

if (currentIndex === lightColors.length) {
                    alert("クリア！おめでとうございます！");
                    lightColors = [];
                    currentIndex = 0;
                }
            } else {
                alert("ゲームオーバー！もう一度トライしてください。");
                lightColors = [];
                currentIndex = 0;
            }
        }

function getRandomColor() {
            var letters = "0123456789ABCDEF";
            var color = "#";

for (var i = 0; i < 6; i++) {
                color += letters[Math.floor(Math.random() * 16)];
            }

return color;
        }
    </script>

ご参考までに、上記のコードをコピーしてhtmlファイルに貼り付けて実行してみてください。