Make a really cute game where little kittens have to collect yarn and treats to grow up.'s game

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

No:40569

←

Prev Next

→

Make a really cute game where little kittens have ..ALL
Developer User18196｜Date and time 24/2/3 14:43:04
Build time 11.463 sec｜Game capacity 3.764KB｜

Script

Sure! Here's a cute game where little kittens have to collect yarn and treats to grow up. It is implemented as a single HTML file, enclosed in script tags, and written in JavaScript. The game is playable and compatible with smartphone operation. Pictograms are used whenever possible. Feel free to customize the game further according to your preferences.

To use this code, please place the following images in the same directory as the HTML file: - kitten.png (replace with an actual kitten pictogram) - yarn.png (replace with a yarn ball pictogram) - treat.png (replace with a treat pictogram) The game is designed to use the arrow keys on the keyboard for mobile devices as well. You can adjust the game appearance, items, and add more functionality based on your preferences.

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>Kitten Adventure Game</title>
</head>
<body>
    <canvas id="gameCanvas" width="800" height="600"></canvas>

// Initialization
        window.onload = function() {
            canvas = document.getElementById('gameCanvas');
            canvasContext = canvas.getContext('2d');
            kittenImg = document.createElement('img');
            kittenImg.src = 'kitten.png';
            yarnImg = document.createElement('img');
            yarnImg.src = 'yarn.png';
            treatImg = document.createElement('img');
            treatImg.src = 'treat.png';

// Event listener for arrow key inputs
            document.addEventListener('keydown', moveKitten);

// Start game loop
            setInterval(updateGame, 20);
        }

// Move the kitten based on arrow key inputs
        function moveKitten(event) {
            const speed = 5;
            
            switch(event.keyCode) {
                case 37: // Left arrow key
                    kittenX -= speed;
                    break;
                case 38: // Up arrow key
                    kittenY -= speed;
                    break;
                case 39: // Right arrow key
                    kittenX += speed;
                    break;
                case 40: // Down arrow key
                    kittenY += speed;
                    break;
            }
        }

// Update game state and draw on the canvas
        function updateGame() {
            drawBackground();
            drawKitten();
            drawYarn();
            drawTreat();
            drawScore();
        }

// Draw the game background
        function drawBackground() {
            // You can modify/improve the background here
            canvasContext.fillStyle = '#fde9d9';
            canvasContext.fillRect(0, 0, canvas.width, canvas.height);
        }

// Draw the kitten
        function drawKitten() {
            canvasContext.drawImage(kittenImg, kittenX, kittenY, 50, 50);
        }

// Draw the collected yarn
        function drawYarn() {
            // You can modify/improve the way yarn appears here
            canvasContext.drawImage(yarnImg, 200, 200, 30, 30);
        }

// Draw the collected treat
        function drawTreat() {
            // You can modify/improve the way treat appears here
            canvasContext.drawImage(treatImg, 400, 400, 40, 40);
        }

// Draw the score on the canvas
        function drawScore() {
            canvasContext.fillStyle = '#000000';
            canvasContext.font = '20px Arial';
            canvasContext.fillText('Score: ' + score, 10, 30);
        }
    </script>
</body>
</html>
```

The game is designed to use the arrow keys on the keyboard for mobile devices as well. You can adjust the game appearance, items, and add more functionality based on your preferences.