Cursor auf Fingerzeiger ändern

Ich habe dies aund ich weiß nicht, dass ich es in den "onmouseover" einfügen muss, damit der Cursor wie ein normaler Link zum Fingerzeiger wechselt:

<a class="menu_links" onclick="displayData(11,1,0,'A')" onmouseover=""> A </a>

Ich habe irgendwo gelesen, was ich sagen muss:

onmouseover="cursor: hand (a pointing hand)"

Aber es funktioniert nicht bei mir.

Außerdem bin ich mir nicht sicher, ob dies als JavaScript, CSS oder einfach nur HTML betrachtet wird.

<a class="menu_links" onclick="displayData(11,1,0,'A')" onmouseover="" style="cursor: pointer;"> A </a>

Es ist CSS.

Oder in einem Stylesheet:

a.menu_links { cursor: pointer; }

Sie können dies in CSS tun:

a.menu_links {
    cursor: pointer;
}

Dies ist eigentlich das Standardverhalten für Links. Sie müssen es entweder an anderer Stelle in Ihrem CSS überschrieben haben oder es enthält kein hrefAttribut (es fehlt in Ihrem Beispiel).

Ich benutze diesen gerne, wenn ich nur einen Link auf der Seite habe:

onMouseOver="this.style.cursor='pointer'"

in CSS schreiben

a.menu_links:hover{ cursor:pointer}

Hier ist etwas Cooles, wenn Sie damit die Extrameile gehen wollen. In der URL können Sie einen Link verwenden oder ein Bild-PNG speichern und den Pfad verwenden. beispielsweise:

URL ('Assets / Imgs / theGoods.png');

unten ist der Code:

.cursor{
  cursor:url(http://www.icon100.com/up/3772/128/425-hand-pointer.png), auto;
}

Dies funktioniert also nur unter der Größe 128 x 128, größer und das Bild wird nicht geladen. Sie können aber praktisch jedes gewünschte Bild verwenden! Dies wäre reines CSS3 und etwas HTML. Alles, was Sie in HTML tun müssen, ist

<div class='cursor'></div>

und nur in diesem div wird dieser Cursor angezeigt. Also füge ich es normalerweise dem Body-Tag hinzu.

Ich denke, dass die oben genannte "beste Antwort", obwohl programmatisch korrekt, die gestellte Frage nicht wirklich beantwortet. In der Frage wird gefragt, wie der Zeiger im Mouseover-Ereignis geändert werden soll. Ich sehe Beiträge darüber, wie man irgendwo einen Fehler haben kann, der die Frage nicht beantwortet. In der akzeptierten Antwort ist das Mouseover-Ereignis leer ( onmouseover="") und stattdessen ist die Stiloption enthalten. Verblüffend, warum dies getan wurde.

An dem Link des Anfragenden ist möglicherweise nichts auszusetzen. Betrachten Sie das folgende HTML:

<a id=test_link onclick="alert('kinda neat);">Click ME!</a>

Wenn ein Benutzer mit der Maus über diesen Link fährt, ändert sich der Zeiger nicht in eine Hand. Stattdessen verhält sich der Zeiger so, als würde er über normalem Text schweben. Man möchte das vielleicht nicht ... und so muss der Mauszeiger angewiesen werden, sich zu ändern.

Die gesuchte Antwort lautet: (die von einem anderen gepostet wurde):

<a id=test_link onclick="alert('Nice!');"
       onmouseover="this.style.cursor='pointer';">Click ME!</a>

Dies ist jedoch ... ein Albtraum, wenn Sie viele davon haben oder diese Art von Dingen überall verwenden und sich entscheiden, eine Art Änderung vorzunehmen oder auf einen Fehler zu stoßen. besser eine CSS-Klasse dafür zu machen:

a.lendhand {
  cursor: pointer;
}

dann:

<a class=lendhand onclick="alert('hand is lent!');">Click ME!</a>

Es gibt viele andere Möglichkeiten, die wohl besser wären als diese Methode. DIV s, BUTTON s, IMG s, etc könnte mehr als nützlich erweisen. Ich sehe jedoch keinen Schaden in der Verwendung <a>...</a>.

Jarett.

Fügen Sie ein hrefAttribut hinzu, um es zu einem gültigen Link zu machen, und return false;im Ereignishandler, um zu verhindern, dass es eine Navigation verursacht.

<a href="#" class="menu_links" onclick="displayData(11,1,0,'A'); return false;" onmouseover=""> A </a>

(Oder machen Sie die displayData()Rückgabe falsch und ..="return displayData(..)

Die Lösung über reines CSS, wie in der als am besten gekennzeichneten Antwort angegeben, ist für diese Situation nicht geeignet.

Das Beispiel in diesem Thema hat kein normales statisches href-Attribut, es ruft nur JS auf, daher wird es ohne JS nichts tun.

Es ist also gut, den Zeiger nur mit JS einzuschalten. Also Lösung

onMouseOver="this.style.cursor='pointer'"

wie oben erwähnt (aber ich kann es dort nicht kommentieren) ist das beste in diesem Fall. (Aber im Allgemeinen ist es für normale Links, die kein JS erfordern, besser, mit reinem CSS ohne JS zu arbeiten.)