Top-Down RPG you get swort and you kylling zombie's game

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

No:39292

←

Prev Next

→

Top-Down RPG you get swort and you kylling zombie
Developer User17581｜Date and time 24/1/27 19:31:37
Build time 20.097 sec｜Game capacity 6.055KB｜

Script

Sure! Here's an example of a simple top-down RPG game in a single HTML file, using JavaScript and enclosed in script tags. The game involves a player obtaining a sword and killing zombies. Since you mentioned smartphone operation, the game will have buttons for player movement and attacking, and pictograms will be used for graphical representation.

Please note that this is just a basic implementation to give you an idea, and it can be expanded upon to add more features, levels, and complexity. You will need to replace the placeholder pictograms (``) with appropriate image or pictogram elements for zombies. Similarly, you'll need to update the image paths (`emozi_all/pictogram.png` and `emozi_all/sword.png`) to actual image paths or use appropriate pictograms for the player and sword.

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>Top-Down RPG Game</title>
    <style>
        #game-container {
            position: relative;
            width: 320px;
            height: 480px;
            border: 1px solid black;
            overflow: hidden;
        }
        
        #player {
            position: absolute;
            top: 200px;
            left: 100px;
        }
        
        #sword {
            position: absolute;
            top: -50px;
            left: -50px;
        }
        
        #zombies-container {
            position: absolute;
            top: 50px;
            left: 50px;
        }
        
        .zombie {
            position: absolute;
            top: 0;
            left: 0;
        }
        
        #buttons {
            text-align: center;
            margin-top: 20px;
        }
    </style>
</head>
<body>
    <div id="game-container">
        <img id="player" src="player.png" alt="Player">
        <img id="sword" src="sword.png" alt="Sword">
        <div id="zombies-container">
            
        </div>
    </div>
    
    <div id="buttons">
        <button id="up-button">↑</button>
        <br>
        <button id="left-button">←</button>
        <button id="attack-button">✔</button>
        <button id="right-button">→</button>
        <br>
        <button id="down-button">↓</button>
    </div>
    
    <script>
        var player = document.getElementById("player");
        var sword = document.getElementById("sword");
        var zombiesContainer = document.getElementById("zombies-container");
        var attackButton = document.getElementById("attack-button");
        var upButton = document.getElementById("up-button");
        var leftButton = document.getElementById("left-button");
        var rightButton = document.getElementById("right-button");
        var downButton = document.getElementById("down-button");
        
        var playerPositionX = 100;
        var playerPositionY = 200;
        var swordEquipped = false;
        
        // Zombie positions (sample positions)
        var zombies = [
            { x: 50, y: 100 },
            { x: 150, y: 300 },
            { x: 250, y: 200 }
        ];

// Function to update player position and handle collision
        function updatePlayerPosition(dx, dy) {
            playerPositionX += dx;
            playerPositionY += dy;
            
            player.style.left = playerPositionX + "px";
            player.style.top = playerPositionY + "px";

// Check collision with sword
            if (!swordEquipped && swordPosition && checkCollision(playerPositionX, playerPositionY, swordPosition.x, swordPosition.y)) {
                swordEquipped = true;
                sword.style.top = "0";
                sword.style.left = "0";
            }
            
            // Check collision with zombies
            for (var i = 0; i < zombies.length; i++) {
                var zombie = document.getElementById("zombie-" + i);
                
                if (checkCollision(playerPositionX, playerPositionY, zombies[i].x, zombies[i].y)) {
                    if (swordEquipped) {
                        // Kill the zombie
                        zombiesContainer.removeChild(zombie);
                        zombies.splice(i, 1);
                        i--;
                    } else {
                        // Game over if no sword
                        gameOver();
                        return;
                    }
                }
            }
            
            // Game over if no more zombies left
            if (zombies.length === 0) {
                gameOver(true);
            }
        }
        
        // Function to check collision between two objects
        function checkCollision(x1, y1, x2, y2) {
            return x1 === x2 && y1 === y2;
        }
        
        // Function to handle game over
        function gameOver(playerWon) {
            if (playerWon) {
                alert("Congratulations! You killed all the zombies and saved the town!");
            } else {
                alert("Game over! The zombies got you. Try again!");
            }
            
            // Reset game
            window.location.reload();
        }
        
        // Event listeners for movement buttons
        upButton.addEventListener("click", function() {
            updatePlayerPosition(0, -50);
        });
        
        leftButton.addEventListener("click", function() {
            updatePlayerPosition(-50, 0);
        });
        
        rightButton.addEventListener("click", function() {
            updatePlayerPosition(50, 0);
        });
        
        downButton.addEventListener("click", function() {
            updatePlayerPosition(0, 50);
        });
        
        // Event listener for attack button
        attackButton.addEventListener("click", function() {
            if (swordEquipped) {
                // Attack logic
                // Assuming the sword attack will be implemented separately
                // You can add appropriate logic here to attack zombies
            }
        });
    </script>
</body>
</html>
```

Please note that this is just a basic implementation to give you an idea, and it can be expanded upon to add more features, levels, and complexity. You will need to replace the placeholder pictograms (``) with appropriate image or pictogram elements for zombies. Similarly, you'll need to update the image paths (`player.png` and `sword.png`) to actual image paths or use appropriate pictograms for the player and sword.