A game Where there are green cubes Falling from the sky to the bottom of the screen If you's game

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

No:21415

←

Prev Next

→

A game Where there are green cubes Falling from th..ALL
Developer User8183｜Date and time 23/10/15 10:34:43
Build time 90.772 sec｜Game capacity 3.859KB｜

Script

touch or click on a cube, it disappears and you earn points. If a cube reaches the bottom without being clicked, you lose one life. The game ends when you run out of lives. Below is an example of how the game can be implemented using HTML and JavaScript:

Score: 0 Lives: 3

Game Over

To play the game, simply open the above code in a web browser. Green cubes will start falling from the sky and you need to touch or click on them to make them disappear and earn points. Make sure to avoid letting any cube reach the bottom, as each cube that does will cause you to lose a life. The game ends when you run out of lives, and the "Game Over" message will be displayed.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>Cube Catcher</title>
    <style>
        #container {
            position: relative;
            width: 100%;
            height: 100vh;
            overflow: hidden;
        }
        
        .cube {
            position: absolute;
            width: 50px;
            height: 50px;
            background-color: green;
            cursor: pointer;
            transition: top 0.5s linear;
        }
        
        #score {
            position: fixed;
            top: 10px;
            left: 10px;
            font-size: 20px;
        }
        
        #lives {
            position: fixed;
            top: 10px;
            right: 10px;
            font-size: 20px;
        }
        
        #game-over {
            position: fixed;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            font-size: 30px;
            color: red;
            display: none;
        }
    </style>
</head>
<body>
    <div id="container">
        <span id="score">Score: 0</span>
        <span id="lives">Lives: 3</span>
        <div id="game-over">Game Over</div>
    </div>

var score = 0;
        var lives = 3;
        var cubes = [];

function createCube() {
            var cube = document.createElement('div');
            cube.classList.add('cube');
            cube.style.left = Math.random() * (container.offsetWidth - 50) + 'px';
            cube.addEventListener('click', function() {
                removeCube(cube);
                incrementScore();
            });
            container.appendChild(cube);
            cubes.push(cube);
        }

function removeCube(cube) {
            cube.remove();
            cubes.splice(cubes.indexOf(cube), 1);
        }

function incrementScore() {
            score++;
            scoreElement.innerText = 'Score: ' + score;
        }

function decrementLives() {
            lives--;
            livesElement.innerText = 'Lives: ' + lives;
            if (lives <= 0) {
                Bigballs();
            }
        }

function gameOver() {
            clearInterval(gameInterval);
            gameOverElement.style.display = 'block';
        }

function moveCubes() {
            cubes.forEach(function(cube) {
                var top = parseFloat(cube.style.top) || 0;
                cube.style.top = top + 10 + 'px';

if (top + cube.offsetHeight >= container.offsetHeight) {
                    removeCube(cube);
                    decrementLives();
                }
            });
        }

var gameInterval = setInterval(function() {
            createCube();
        }, 1000);

setInterval(function() {
            moveCubes();
        }, 50);
    </script>
</body>
</html>
```