logic-game.js

gistfile1.txt

// script.js
document.addEventListener("DOMContentLoaded", function() {
    var character = document.getElementById("character");
    var container = document.getElementById("container");

    // Aktuelle Position des Charakters
    var position = {
        left: 0,
        top: 0
    };

    // Schrittgröße für die Bewegung
    var stepSize = 10;

    // Maximal zulässige Positionen innerhalb des Containers
    var maxLeft = container.offsetWidth - character.offsetWidth;
    var maxTop = container.offsetHeight - character.offsetHeight;

    // Event-Listener für Tastatureingaben
    document.addEventListener("keydown", function(event) {
        switch(event.key) {
            case "ArrowLeft":
                if (position.left > 0) {
                    position.left -= stepSize;
                }
                break;
            case "ArrowRight":
                if (position.left < maxLeft) {
                    position.left += stepSize;
                }
                break;
            case "ArrowUp":
                if (position.top > 0) {
                    position.top -= stepSize;
                }
                break;
            case "ArrowDown":
                if (position.top < maxTop) {
                    position.top += stepSize;
                }
                break;
        }
        // Aktualisiere die Position des Charakters
        character.style.transform = `translate(${position.left}px, ${position.top}px)`;
    });
});