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

No:29548

The egg will slowly come to the door 🚪 when it get..ALL
Developer User12051｜Date and time 23/12/17 13:13:15
Build time 15.959 sec｜Game capacity 2.185KB｜

Script

Sure! Here's an example implementation of the game you described:

Lights Out Game

In this game, when the lights are turned on by clicking the "Toggle Lights" button, the image of the door changes to a closed door. If the lights are turned off again, the image changes back to an open door. Meanwhile, the fill bar starts filling up gradually (at a rate of 10% per second) if the lights are on. If the fill bar reaches 100%, a message pops up indicating that the player has died. Please note that you will need to provide the images (`emozi_bear.png` and `emozi_chicken.png`) in the same directory as the HTML file for the game to work properly.

←

Prev　Next

→ 　

Back　

[PR]現在のプレゼントランキング

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

Sure! Here's an example implementation of the game you described:

```html
<!DOCTYPE html>
<html>
<head>
    <title>Lights Out Game</title>
    <script>
        let lightsOn = false;
        let fillBar = 0;
        
        function toggleLights() {
            lightsOn = !lightsOn;
            if (lightsOn) {
                document.getElementById("door").src = "door_closed.png";
            } else {
                document.getElementById("door").src = "door_open.png";
                if (fillBar >= 100) {
                    alert("You died!");
                }
            }
        }
        
        function incrementFillBar() {
            if (lightsOn) {
                fillBar += 10;
                document.getElementById("fillBar").style.width = fillBar + "%";
            }
        }
        
        setInterval(incrementFillBar, 1000);
    </script>
    <style>
        #container {
            margin-top: 20px;
            text-align: center;
        }
        
        #door {
            width: 200px;
        }
        
        #fillBarWrapper {
            background-color: lightgray;
            height: 30px;
        }
        
        #fillBar {
            background-color: red;
            height: 100%;
            width: 0%;
        }
    </style>
</head>
<body>
    <div id="container">
        <h1>Lights Out Game</h1>
        <img id="door" src="door_open.png" alt="Door">
        <br>
        <button onclick="toggleLights()">Toggle Lights</button>
        <br>
        <div id="fillBarWrapper">
            <div id="fillBar"></div>
        </div>
    </div>
</body>
</html>
```

Please note that you will need to provide the images (`door_open.png` and `door_closed.png`) in the same directory as the HTML file for the game to work properly.