A platform game about rock stars battling monsters's game

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

No:30501

102

←

Prev Next

→

A platform game about rock stars battling monsters
Developer User14814｜Date and time 23/12/22 9:13:03
Build time 18.697 sec｜Game capacity 3.812KB｜

Script

Sure, I can help you create a platform game about rock stars battling monsters using JavaScript and HTML. Here's a basic implementation for a single HTML file with JavaScript code enclosed in script tags:

You can save the above code in a single HTML file, open it in a web browser, and play the game. The game consists of a black game area with a yellow player character at the bottom. Red monsters start falling from the top of the game area, and the player can move left and right using arrow keys to avoid the monsters. If a monster collides with the player, the game ends.

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>Rock Star Battle</title>
    <style>
        #game {
            width: 400px;
            height: 300px;
            background-color: #000;
            position: relative;
        }
        
        #player {
            width: 50px;
            height: 50px;
            background-color: #ff0;
            position: absolute;
        }
        
        .monster {
            width: 40px;
            height: 40px;
            background-color: #f00;
            position: absolute;
        }
    </style>
</head>
<body>
    <div id="game">
        <div id="player"></div>
    </div>

let playerX = 0; // Player's initial position
        let playerY = 250;
        let monstersInterval; // Timer for monster generation

// Function to handle player movement
        function movePlayer(e) {
            if (e.key === 'ArrowLeft') {
                playerX -= 10; // Move player left
            } else if (e.key === 'ArrowRight') {
                playerX += 10; // Move player right
            }
            player.style.left = playerX + 'px'; // Update player's position
        }

// Function to generate monsters periodically
        function generateMonsters() {
            const monster = document.createElement('div');
            monster.className = 'monster';
            monster.style.left = Math.random() * 350 + 'px'; // Random horizontal position
            monster.style.top = -40 + 'px'; // Start at the top of the game area
            game.appendChild(monster);
            monsters.push(monster);

// Move the monster down the game area
            const moveMonsterInterval = setInterval(() => {
                const monsterRect = monster.getBoundingClientRect();
                const playerRect = player.getBoundingClientRect();
                if (monsterRect.bottom >= playerRect.top && monsterRect.right >= playerRect.left &&
                    monsterRect.left <= playerRect.right) {
                    // If monster collides with the player, game over
                    clearInterval(monstersInterval);
                    clearInterval(moveMonsterInterval);
                    alert('Game Over! You got hit by a monster!');
                    return;
                }

monster.style.top = monster.offsetTop + 2 + 'px';

if (monster.offsetTop >= game.offsetHeight) {
                    // If monster reaches the bottom, remove it from the game
                    game.removeChild(monster);
                    monsters.splice(monsters.indexOf(monster), 1);
                    clearInterval(moveMonsterInterval);
                }
            }, 10);
        }

// Event listener to start the game on touch or click
        game.addEventListener('click', () => {
            game.removeEventListener('click');
            monstersInterval = setInterval(generateMonsters, 1500);
            window.addEventListener('keydown', movePlayer);
        });
    </script>
</body>
</html>
```