Catch the falling blocks!

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Catch the Falling Objects</title>
    <style>
        body {
            margin: 0;
            padding: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            background-color: #f0f0f0;
        }
        #game-area {
            width: 300px;
            height: 400px;
            border: 2px solid #333;
            position: relative;
        }
        .falling-object {
            width: 30px;
            height: 30px;
            background-color: red;
            position: absolute;
            top: 0;
            left: 0;
            border-radius: 50%;
        }
    </style>
</head>
<body>
    <div id="game-area">
    </div>

    <script>
        // Function to generate a random number within a range
        function random(min, max) {
            return Math.floor(Math.random() * (max - min + 1)) + min;
        }

        // Function to create falling objects
        function createFallingObject() {
            const object = document.createElement('div');
            object.classList.add('falling-object');
            object.style.left = random(0, 270) + 'px'; // Random position within game area width
            document.getElementById('game-area').appendChild(object);

            // Set interval to move the falling object
            const fallInterval = setInterval(() => {
                const currentTop = parseInt(object.style.top);
                if (currentTop >= 370) { // If object reaches bottom
                    clearInterval(fallInterval);
                    object.remove();
                } else {
                    object.style.top = (currentTop + 5) + 'px'; // Move object down
                }
            }, 50);
        }

        // Function to start the game
        function startGame() {
            setInterval(createFallingObject, 2000); // Create falling objects every 2 seconds
        }

        // Call startGame function when the page loads
        window.onload = startGame;
    </script>
</body>
</html>