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

No:49304

120

←

Prev Next

→

Oh no Donald duck has became a snake collect the d..ALL
Developer Kason Lucas｜Date and time 24/3/4 10:42:46
Build time 10.904 sec｜Game capacity 2.783KB｜

Script

Donald Duck Snake Game

Score: 0

←

Prev　Next

→ 　

Back　

[PR]現在のフィギュア売れ筋ランキング

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

<!DOCTYPE html>
<html>
<head>
    <title>Donald Duck Snake Game</title>
    <style>
        body {
            text-align: center;
            font-family: Arial, sans-serif;
        }
        canvas {
            border: 1px solid black;
        }
    </style>
</head>
<body>
    <h1>Donald Duck Snake Game</h1>
    <canvas id="gameCanvas" width="400" height="400"></canvas>
    <div>Score: <span id="score">0</span></div>

const moveSnake = () => {
            x += dx;
            y += dy;
        }

const drawSnake = () => {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            ctx.fillStyle = 'green';
            ctx.fillRect(x, y, dotSize, dotSize);
        }

const generateDot = () => {
            const dotX = Math.floor(Math.random() * (canvas.width - dotSize));
            const dotY = Math.floor(Math.random() * (canvas.height - dotSize));
            ctx.fillStyle = 'red';
            ctx.fillRect(dotX, dotY, dotSize, dotSize);
            return { x: dotX, y: dotY };
        }

let dot = generateDot();

const gameLoop = () => {
            moveSnake();
            drawSnake();
            if (checkCollision(dot)) {
                dot = generateDot();
            }
            requestAnimationFrame(gameLoop);
        }

window.addEventListener('keydown', (e) => {
            switch (e.key) {
                case 'ArrowUp':
                    dx = 0;
                    dy = -dotSize;
                    break;
                case 'ArrowDown':
                    dx = 0;
                    dy = dotSize;
                    break;
                case 'ArrowLeft':
                    dx = -dotSize;
                    dy = 0;
                    break;
                case 'ArrowRight':
                    dx = dotSize;
                    dy = 0;
                    break;
            }
        });

gameLoop();
    </script>
</body>
</html>