it-swarm.com.de

Bewegen Sie den Mauszeiger mit der Maus über einen ankerartigen Stil

Wenn ich die Maus über ein div bewege, wird der Mauszeiger in den Cursor geändert, der dem HTML-Anker entspricht.

Wie kann ich das machen? Benötige ich Javascript oder ist es nur mit CSS möglich?

95
shibly

Angenommen, Ihr div hat einen id="myDiv", Fügen Sie Ihrem CSS Folgendes hinzu. Das cursor: pointer Gibt an, dass der Cursor dasselbe Handsymbol sein soll, das für Anker (Hyperlinks) verwendet wird:

CSS zum Hinzufügen

#myDiv
{
    cursor: pointer;
}

Sie können den Cursor-Stil einfach wie folgt in den HTML-Code Ihres div einfügen:

<div style="cursor: pointer">

</div>

EDIT:

Wenn Sie dazu entschlossen sind, jQuery zu verwenden, fügen Sie die folgende Zeile zu Ihrer $(document).ready() oder body onload hinzu: (Ersetzen Sie myClass durch eine beliebige Klasse in Ihrer divs share)

$('.myClass').css('cursor', 'pointer');
198
Devin Burke

Wenn Sie dies in jQuery anstelle von CSS tun möchten, befolgen Sie im Grunde den gleichen Prozess.

Angenommen, Sie haben einige <div id="target"></div> können Sie den folgenden Code verwenden:

$("#target").hover(function() {
    $(this).css('cursor','pointer');
}, function() {
    $(this).css('cursor','auto');
});

und das sollte es tun.

22
Ryan Atallah

Sie brauchen jQuery eigentlich nicht, nur CSS. Zum Beispiel ist hier etwas HTML:

<div class="special"></div>

Und hier ist das CSS:

.special
{
    cursor: pointer;
}
8
attack

Dieser Wille

#myDiv
{
    cursor: pointer;
}
4
Sinetheta

Ich glaube :hover fehlte in den obigen Antworten. Also würde folgendes das Nötigste tun. (Wenn CSS erforderlich wäre)

#myDiv:hover
{
    cursor: pointer;
}
0
being_ethereal