A game about a butterfly flying in a field and the gamer controls the bytterfly's game

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

No:46408

←

Prev Next

→

A game about a butterfly flying in a field and the..ALL
Developer User20078｜Date and time 24/2/24 20:24:13
Build time 6.271 sec｜Game capacity 1.723KB｜

Script

This is a simple game where you can control a butterfly flying in a field using the arrow keys on your smartphone. The butterfly can move up, down, left, and right. Enjoy playing!

←

Prev　Next

→ 　

Back　

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

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>Butterfly Flying Game</title>
</head>
<body>
    <canvas id="gameCanvas" width="800" height="600"></canvas>
    <script>
        const canvas = document.getElementById("gameCanvas");
        const ctx = canvas.getContext("2d");

let butterflyX = 400;
        let butterflyY = 300;

function drawButterfly() {
            ctx.fillStyle = "orange";
            ctx.beginPath();
            ctx.arc(butterflyX, butterflyY, 20, 0, Math.PI * 2);
            ctx.fill();
            ctx.fillStyle = "black";
            ctx.font = "20px Arial";
            ctx.fillText("🦋", butterflyX - 10, butterflyY + 8);
        }

function clearCanvas() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
        }

function updateGame() {
            clearCanvas();
            drawButterfly();
        }

function handleInput(event) {
            const key = event.key;
            switch(key) {
                case "ArrowUp":
                    butterflyY -= 10;
                    break;
                case "ArrowDown":
                    butterflyY += 10;
                    break;
                case "ArrowLeft":
                    butterflyX -= 10;
                    break;
                case "ArrowRight":
                    butterflyX += 10;
                    break;
            }
        }

document.addEventListener("keydown", handleInput);

setInterval(updateGame, 1000 / 30);
    </script>
</body>
</html>
```
This is a simple game where you can control a butterfly flying in a field using the arrow keys on your smartphone. The butterfly can move up, down, left, and right. Enjoy playing!