nietaL
NGBler
Hallo Leute,
ich komme nicht mehr weiter, obwohl ich viel nachgelesen habe. Es geht darum, dass ein Kreis um den Cursor entstehen soll - aber nur solange der Mauspfeil auf einem bestimmten Bereich ist, dann soll die Verfolgung durch den Kreis aufhören.
Ich möchte ein durch onMouseOver hinzugefügten eventListener mit onMouseOut also wieder entfernen. Ersters klappt wunderbar, letzteres leider nicht. Ich habe auch die Debugging-Konsole von Chrome verwendet und gesehen, dass das Event stur erhalten bleibt. Ausgaben in der Console verraten mir, dass der Interpreter zumindest über den remove-Befehl rübergerollt ist. Könnt ihr mir erklären, warum er nicht aufhören möchte? Würde mich über Tipps sehr freuen.
Cursor-Element
Javascript Funktionen
Auslösender HTML-Teil
ich komme nicht mehr weiter, obwohl ich viel nachgelesen habe. Es geht darum, dass ein Kreis um den Cursor entstehen soll - aber nur solange der Mauspfeil auf einem bestimmten Bereich ist, dann soll die Verfolgung durch den Kreis aufhören.
Ich möchte ein durch onMouseOver hinzugefügten eventListener mit onMouseOut also wieder entfernen. Ersters klappt wunderbar, letzteres leider nicht. Ich habe auch die Debugging-Konsole von Chrome verwendet und gesehen, dass das Event stur erhalten bleibt. Ausgaben in der Console verraten mir, dass der Interpreter zumindest über den remove-Befehl rübergerollt ist. Könnt ihr mir erklären, warum er nicht aufhören möchte? Würde mich über Tipps sehr freuen.
Cursor-Element
<div class="cursor" id="cursor"></div>
Javascript Funktionen
function changeCursor(direction)
{
var cursor = document.getElementById("cursor");
var handler = function (e) {
cursor.style.left = e.clientX + "px",
cursor.style.top = e.clientY + "px";
console.log(cursor.style.top);
}
if(direction == "over")
{
window.document.addEventListener("mousemove", handler);
window.document.removeEventListener("mousemove", handler, true);
console.log("over");
}
else if (direction == "out")
{
window.document.removeEventListener("mousemove", handler, true);
console.log("out");
}
}
Auslösender HTML-Teil
echo "<canvas id=\"bildkoord\" height=\"500\" width=\"500\" onMouseOver=\"changeCursor('over');\" onMouseOut=\"changeCursor('out');\" onClick=\"koordinaten(this, event); storeCoords();\" style=\"border:1px solid grey; background-image:url(img/sieger.jpg); background-size:contain; background-repeat:no-repeat; display: block; \"></canvas>";