AI game creator

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

No:49222

110

←

Prev Next

→

Melon playground
Developer User20959｜Date and time 24/3/4 3:14:41
Build time 5.594 sec｜Game capacity 1.672KB｜

Script

←

Prev　Next

→ 　

Back　

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

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

<!DOCTYPE html>
<html>
    <head>
        <title>Melon Playground</title>
        <style>
            canvas {
                border: 1px solid black;
                display: block;
                margin: 0 auto;
            }
        </style>
    </head>
    <body>
        <canvas id="gameCanvas" width="400" height="400"></canvas>
        
        <script>
            const canvas = document.getElementById('gameCanvas');
            const ctx = canvas.getContext('2d');
            
            let melonX = 200;
            let melonY = 200;
            let melonSize = 50;
            
            function drawMelon() {
                ctx.fillStyle = 'orange';
                ctx.fillRect(melonX, melonY, melonSize, melonSize);
            }
            
            function moveMelon(dx, dy) {
                melonX += dx;
                melonY += dy;
            }
            
            function handleKeyPress(event) {
                const speed = 10;
                
                if (event.key === 'ArrowUp') {
                    moveMelon(0, -speed);
                } else if (event.key === 'ArrowDown') {
                    moveMelon(0, speed);
                } else if (event.key === 'ArrowLeft') {
                    moveMelon(-speed, 0);
                } else if (event.key === 'ArrowRight') {
                    moveMelon(speed, 0);
                }
                
                ctx.clearRect(0, 0, canvas.width, canvas.height);
                drawMelon();
            }
            
            document.addEventListener('keydown', handleKeyPress);
            
            drawMelon();
        </script>
    </body>
</html>