Mauszeiger durch Fadenkreuz ersetzen

[Jofre]

Ich möchte gern, wenn ich über eine Canvas mit der Maus gehe, den Zeiger durch ein Fadenkreuz ersetzen.
Wenn ich das Fadenkreuz z.B. durch ein png Bilde ersetzen indem ich dessen x und y Koordinaten mit den Mauskooordinaten fülle, dann ist der Mauszeiger noch sichtbar und ich müsste - nach meinen Kentnissen - ein permanentes clear canvas durchführen. Das verträgt sich aber nicht mit dem eigentlichen Programmablauf.

eine Idee?

GzG

Joachim

 

[Sempervivum]

Den Mauszeiger kannst Du auch mit CSS durch eine eigene Grafik ersetzen:
https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Benutzeroberfläche/cursor#eigene_Grafiken

 

[Jofre]

Ich habe canvas als Basis genommen. klappt prinzipiell. Danke

Die mouse Koordinaten entsprechen nicht der Bildmitte des Fadenkreuzes sondern -wenn ich ein Quadrat darum zeichne - der linken oberen Ecke des Quadrats, praktisch der oberen linken Ecke des "Bildes " .

oder?

 

[Sempervivum]

Das stimmt, das musst Du umrechnen.

 

[Jan-Frederik Stieler]

Canvas sind aber rechenintensiver als CSS.

 

[Jofre]

Verstehe ich nicht.

ich möchte, wenn ich mit der Maus auf das Schlachtfeld komme = hier gleich canvas, dass der Mauszeiger zu einem Fadenkreuz wird. Das mache ich in CSS mit
cursor: url(fadenkreuz.png)

In javascript rechne ich dann dann xy links oben Fadenkreuz auf xy Fadenkreuz Mitte durch einfache Addition Bild/2 um.

Was wäre Dein Ansatz?

GuG

Joachim