Sonic spiel mit schönem Hintergrund. Gib keine Erklärung.'s game

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

No:28355

130

←

Prev Next

→

Sonic spiel mit schönem Hintergrund. Gib keine Erk..ALL
Developer User14077｜Date and time 23/12/12 1:12:43
Build time 13.576 sec｜Game capacity 1.393KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

<!DOCTYPE html>
<html>
<head>
<style>
canvas {
    background-image: url("hintergrund.jpg");
    background-repeat: no-repeat;
    background-size: cover;
}
</style>
</head>
<body>
<canvas id="gameCanvas" width="800" height="600"></canvas>

// Get the canvas element
var canvas = document.getElementById("gameCanvas");
var ctx = canvas.getContext("2d");

// Create Sonic image
var sonicImg = new Image();
sonicImg.src = "sonic.png";

// Sonic object
var sonic = {
    x: 50,
    y: 50,
    speed: 5,
    draw: function() {
        ctx.drawImage(sonicImg, this.x, this.y, 50, 50);
    }
};

// Update function for game logic
function update() {
    // Clear canvas
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    
    // Draw Sonic
    sonic.draw();
    
    // Move Sonic based on input
    document.addEventListener("keydown", function(event) {
        if (event.key === "ArrowUp") {
            sonic.y -= sonic.speed;
        } else if (event.key === "ArrowDown") {
            sonic.y += sonic.speed;
        } else if (event.key === "ArrowLeft") {
            sonic.x -= sonic.speed;
        } else if (event.key === "ArrowRight") {
            sonic.x += sonic.speed;
        }
    });
}

// Game loop
function gameLoop() {
    update();
    requestAnimationFrame(gameLoop);
}

// Start the game
gameLoop();
</script>
</body>
</html>