web-dev-qa-db-fra.com

Déplacez le curseur de la souris sur le style d'ancre

Si je passe la souris sur une div, le curseur de la souris se changera en curseur comme celui de l'ancre HTML.

Comment puis-je faire ceci? Ai-je besoin de Javascript ou est-il possible avec CSS uniquement?

javascriptcssmouse
95
shibly

En supposant que votre div possède un id="myDiv", ajoutez ce qui suit à votre CSS. Le cursor: pointer spécifie que le curseur doit être la même icône de main que celle utilisée pour les ancres (hyperliens):

CSS à ajouter

#myDiv
{
    cursor: pointer;
}

Vous pouvez simplement ajouter le style de curseur au code HTML de votre div comme ceci:

<div style="cursor: pointer">

</div>

EDIT:

Si vous êtes déterminé à utiliser jQuery pour cela, ajoutez la ligne suivante à votre $(document).ready() ou à votre corps onload: (remplacez myClass par quelque classe que ce soit tout votre partage divs)

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

Si vous voulez faire cela dans jQuery au lieu de CSS, vous suivez essentiellement le même processus.

En supposant que vous ayez du <div id="target"></div>, vous pouvez utiliser le code suivant:

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

et cela devrait le faire.

22
Ryan Atallah

En fait, vous n'avez pas besoin de jQuery, juste de CSS. Par exemple, voici du code HTML:

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

Et voici le CSS:

.special
{
    cursor: pointer;
}
8
attack

Cette volonté

#myDiv
{
    cursor: pointer;
}
4
Sinetheta

Je pense que :hover manquait dans les réponses ci-dessus. Donc, faire le nécessaire (si css était nécessaire)

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