JavaScript: Hinzufügen eines Ereignishörers Wenn die Maus unten ist, und sie entfernen, während er auf ist ⇐ JavaScript

[Anonymous]

Ich versuche, ein Pixel -Malprojekt mit HTML, CSS und JS zu erstellen. Ich habe Probleme mit der Malmechanik.for (let i = 0; i {
pixels.setAttribute("style", "background: black");
console.log("painting");
})

}
< /code>
Und dies funktioniert, wenn sich die Maus über der Leinwand befindet. Dies beinhaltet jedoch nicht den MouseDown/MouseUp -Mechaniker. Also habe ich Folgendes ausprobiert: < /p>
Versuchenif (mouseDown) {
pixels.forEach(pixel => {
pixel.style.background = colorSelector.value;
pixel.addEventListener("mouseover", function coloring(event) {
pixel.style.background = colorSelector.value;
if (!mouseDown) {
pixel.removeEventListener("mouseover", coloring);
}
})
})
}
< /code>
Versuchen Sie 2: < /p>
pixels.forEach(pixel => {
if (mouseDown) {
//to color the first pixel clicked
pixel.style.background = colorSelector.value;
pixel.addEventListener("mouseover", function coloring(event) {
pixel.style.background = colorSelector.value;

if (!mouseDown) {
//remove the coloring if the mouse button is up
pixel.removeEventListener("mouseover", coloring);
}
})
}
})
< /code>
Aber keiner scheint zu funktionieren. Ich habe die Mousedown überprüft und es funktioniert, also bin ich mir nicht sicher, warum es nicht ausgeführt wird.