CSS-Problem: Pointer-Events und Cursor-Aussehen?


06.08.2024, 20:37

Der Befehl "pointer-events: none" scheint den Befehl "cursor: not-allowed" also das Aussehen vom Mauszeiger zu verhindern.

1 Antwort

Wenn du das Property pointer-events auf none setzt, bedeutet das, dass du mittels Maus nicht mehr mit dem dazugehörigen Element interagieren kannst. Das Elternelement ist dann das neue Zielelement, welches auf die Aktionen reagiert.

Für deinen Fall solltest du das cursor-Property also auf einem Elternelement des Knopfs setzen.


Zebra321 
Beitragsersteller
 06.08.2024, 21:56

Es gibt aber kein Elternelement? :C

0
Zebra321 
Beitragsersteller
 06.08.2024, 22:28
@regex9

Also klar gibt es ein Elternelement, aber es gibt halt nichts was direkt drumrum ist. Das nächstgrößere Element ist der body...

0
regex9  07.08.2024, 03:15
@Zebra321

Und wieso platzierst du den Knopf dann nicht in in ein Element (z.B. div), welches du neu einfügst? Das Verhalten diesen neuen Elements (Größe o.ä.) kannst du via CSS definieren.

0
Zebra321 
Beitragsersteller
 07.08.2024, 11:50
@regex9

Weil ich das ja um jeden einzelnen Knopf rum dann platzieren müsste... ist auch irgendwie unschön oder? Gibt es keinen anderen Weg? Oder kann man dieses Rundherum auch via CSS irgendwie einfügen? Es gibt ja doch auch properties wie Resize oder? Dass der Knopf größer wird? Und es gibt ja auch Sachen wie .append oder .html wo man Text hinzufügen kann, der im HTML vorher nicht stand also geht vllt ein Objekt wie einen Rahmen hinzuzufügen? Gibt es einen anderen Weg? Ich suche einfach einfache CSS Lösungen sofern möglich ohne das HTML bearbeiten zu müssen, weil das bei 100 Knöpfen dann hinzufügen müsste im HTML Code.

0
regex9  07.08.2024, 12:05
@Zebra321
Gibt es keinen anderen Weg?

Verzichte auf pointer-events. Es ist eh eine schlechte Lösung. Sofern dein Knopf ein button-Element ist, deaktiviere es:

<button disabled>...</button>

Wenn dein Knopf jedoch einem Link (<a>) entspricht, blende ihn aus, solange er non-funktional ist. Zeige Nutzern keine Elemente, mit denen er eh nicht interagieren kann.

0
Zebra321 
Beitragsersteller
 07.08.2024, 12:09
@regex9

Mein Knopf ist ein div und kein button. Was bewirkt denn disabled bei buttons? Und es ist ein <a> Link um das div herum. Ich möchte den Knopf anzeigen. Auf Gutefrage ist es doch genauso! Der Absenden oder Weiter Knopf bei Nachrichten wird ja auch ständig angezeigt, auch wenn noch nicht klickbar. Also nein, möchte ich nicht ausblenden.

0