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

No:13659

A RPG where you play as a cat and unlock abilities..ALL
Developer User5987｜Date and time 23/8/29 8:13:59
Build time 14.725 sec｜Game capacity 3.515KB｜

Script

Sure, here's an example of a single HTML file with JavaScript that implements a simple RPG game where you play as a cat and unlock abilities as you progress. The game is designed for smartphone operation and uses pictograms.

Cat RPG Game

Unlocked Abilities:

Basic Attack

Progress:

0/100 EXP

In this game, the cat starts with a basic attack ability. As the player gains experience (by clicking the "Gain Experience" button), the cat's experience points increase and progress is displayed in a progress bar. When reaching certain experience levels (20 and 50 in this example), new abilities are unlocked and added to the abilities list dynamically. The game can be played by clicking the "Gain Experience" button and observing the abilities unlocking as the player progresses.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋ゲームアプリランキング

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

```html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Cat RPG Game</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
            padding: 20px;
        }
        img {
            max-width: 100%;
        }
        button {
            padding: 10px 20px;
            font-size: 18px;
            margin-top: 20px;
            cursor: pointer;
        }
    </style>
</head>
<body>
    <h1>Cat RPG Game</h1>
    <img src="cat_sprite.png" alt="Cat Image">
    <div id="abilities">
        <h2>Unlocked Abilities:</h2>
        <ul id="abilityList">
            <li>Basic Attack</li>
        </ul>
    </div>
    <div id="progress">
        <h2>Progress:</h2>
        <progress id="expBar" value="0" max="100"></progress>
        <p id="expText">0/100 EXP</p>
    </div>
    <script>
        // Cat character object
        const cat = {
            abilities: ["Basic Attack"],
            exp: 0
        };

// Function to update the abilities list
        function updateAbilities() {
            const abilityList = document.getElementById("abilityList");
            abilityList.innerHTML = "";
            cat.abilities.forEach(ability => {
                const li = document.createElement("li");
                li.textContent = ability;
                abilityList.appendChild(li);
            });
        }

// Function to update the experience progress bar
        function updateProgress() {
            const expBar = document.getElementById("expBar");
            expBar.value = cat.exp;
            const expText = document.getElementById("expText");
            expText.textContent = `${cat.exp}/100 EXP`;
        }

// Function to unlock a new ability when reaching a certain level
        function unlockAbility(level, ability) {
            if (cat.exp >= level && !cat.abilities.includes(ability)) {
                cat.abilities.push(ability);
                updateAbilities();
            }
        }

// Function to handle button click and gain experience
        function gainExperience() {
            cat.exp += 10;
            updateProgress();
            unlockAbility(20, "Scratch"); // Unlock Scratch ability at level 20
            unlockAbility(50, "Pounce"); // Unlock Pounce ability at level 50
        }

// Add button to gain experience
        const button = document.createElement("button");
        button.textContent = "Gain Experience";
        button.addEventListener("click", gainExperience);
        document.body.appendChild(button);

// Initialize the game
        updateAbilities();
        updateProgress();
    </script>
</body>
</html>
```