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

No:16942

Cat goes on quest to save the light, and needs win..ALL
Developer User6439｜Date and time 23/9/21 23:04:51
Build time 41.035 sec｜Game capacity 4.239KB｜

Script

Sure! Here's a simple HTML game where a cat goes on a quest to save the light and needs wings to do so. The cat can fly to realms of other cats. The game will be smartphone-friendly and use pictograms. Remember, you'll need to save the following code in a single HTML file and open it in a web browser to play the game.

Cat's Quest - Wings of Light

Please make sure to have `emozi_all/cat.png`, `emozi_cat.png`, `emozi_rabbit.png`, and `emozi_apple.png` files (actual pictograms or placeholders) in the same directory as this HTML file for the game to display properly. Enjoy your quest to save the light in the realms of cats!

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>Cat's Quest</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #ffffff;
            text-align: center;
        }

#cat {
            width: 100px;
            height: 100px;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
        }

.realm {
            width: 200px;
            height: 200px;
            display: inline-block;
            margin: 10px;
        }

.wing {
            width: 50px;
            height: 50px;
            margin: 5px;
        }
    </style>
</head>
<body>
    <h1>Cat's Quest - Wings of Light</h1>
    <div id="cat"><img src="cat-icon.png"></div>
    <div id="realms">
        <div class="realm" id="realm1"></div>
        <div class="realm" id="realm2"></div>
        <div class="realm" id="realm3"></div>
    </div>

// Check if the cat has wings
        let hasWings = false;

// Handle cat movement
        function moveCat(x, y) {
            const cat = document.getElementById('cat');
            
            // Update cat's new position
            catPosition.x += x;
            catPosition.y += y;

// Check if cat has reached a realm
            if (catPosition.x >= 25 && catPosition.x <= 75 && catPosition.y >= 25 && catPosition.y <= 75) {
                if (hasWings) {
                    alert("Congratulations! You saved the light and saved the realms of cats!");

// Reset game
                    catPosition = {
                        x: 50,
                        y: 50
                    };
                    hasWings = false;
                } else {
                    alert("You need wings to enter the realm!");

// Reset cat's position
                    catPosition = {
                        x: 50,
                        y: 50
                    };
                }
            }

// Update cat's position in the DOM
            cat.style.transform = `translate(${catPosition.x}%, ${catPosition.y}%)`;
        }

// Assign event listeners for cat movement
        document.addEventListener('keydown', function(event) {
            switch (event.key) {
                case 'ArrowUp':
                    moveCat(0, -10);
                    break;
                case 'ArrowDown':
                    moveCat(0, 10);
                    break;
                case 'ArrowLeft':
                    moveCat(-10, 0);
                    break;
                case 'ArrowRight':
                    moveCat(10, 0);
                    break;
            }
        });

// Enable wings for the cat
        function enableWings() {
            hasWings = true;
            alert("Congratulations! You have obtained the wings of light!");
        }

// Add wing selection to a realm
        function addWingOption(realmId, wingId) {
            const realm = document.getElementById(realmId);
            const wing = document.createElement('div');
            wing.setAttribute('class', 'wing');
            wing.style.backgroundImage = `url(wing${wingId}.png)`;
            wing.addEventListener('click', enableWings);
            realm.appendChild(wing);
        }

// Add wing options to each realm
        addWingOption('realm1', 1);
        addWingOption('realm2', 2);
        addWingOption('realm3', 3);
    </script>
</body>
</html>
```

Please make sure to have `cat-icon.png`, `wing1.png`, `wing2.png`, and `wing3.png` files (actual pictograms or placeholders) in the same directory as this HTML file for the game to display properly. Enjoy your quest to save the light in the realms of cats!