Mude o cursor do mouse para o estilo âncora

109

Se eu passar o mouse sobre a, divo cursor do mouse será alterado para o cursor como o da âncora HTML.

Como posso fazer isso? Eu preciso de Javascript ou só é possível com CSS?

evitativamente
fonte

Respostas:

221

Supondo que você divtenha um id="myDiv", adicione o seguinte ao seu CSS. O cursor: pointerespecifica que o cursor deve ser o mesmo ícone de mão usado para âncoras (hiperlinks):

CSS para adicionar

#myDiv
{
    cursor: pointer;
}

Você pode simplesmente adicionar o estilo do cursor ao seu divHTML da seguinte maneira:

<div style="cursor: pointer">

</div>

EDITAR:

Se você está determinado a usar jQuery para isso, adicione a seguinte linha ao seu $(document).ready()corpo ou onload: (substitua myClasspor qualquer classe todas as suas divações)

$('.myClass').css('cursor', 'pointer');
Devin Burke
fonte
Eu quero fazer isso com jquery, não css
provavelmente
7
@guru: Não há necessidade de scripts. Tudo que você precisa fazer é adicionar style="cursor: pointer"ao seu divHTML. Vou editar minha resposta com um exemplo.
Devin Burke
Existem cinco divisões com a mesma classe, eu não posso adicionar a tudo isso "style =" cursor: ponteiro "
provavelmente
@guru, se todos os divs tiverem a mesma classe, então você pode adicionar "cursor: ponteiro" à regra CSS para essa classe no arquivo CSS da sua página
ataque em
1
se o problema for de segmentação, então, como Justin já perguntou, e como todo mundo sempre pergunta, POSTE O CÓDIGO para que possamos ajudá-lo a anexá-lo
Sinetheta
24

Se você quiser fazer isso em jQuery em vez de CSS, basicamente siga o mesmo processo.

Supondo que você tenha algum <div id="target"></div>, você pode usar o seguinte código:

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

e isso deveria bastar.

Ryan Atallah
fonte
3
Isso é supérfluo porque o cursor de a div fica visível quando o mouse está sobre ele. Não há razão para removê-lo depois que o usuário sai do lugar, porque o cursor não seria visto naquele momento.
Devin Burke
2
Embora a pergunta tenha sido feita de forma muito restrita (sobre DIVs), esta resposta se aplica de forma ampla. É útil para qualquer elemento HTML, como tabelas, <p>'s, botões, etc. É por isso que eu marquei com +1.
PeteH de
10

Na verdade, você não precisa do jQuery, apenas CSS. Por exemplo, aqui está algum HTML:

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

E aqui está o CSS:

.special
{
    cursor: pointer;
}
ataque
fonte
6

Isso vai

#myDiv
{
    cursor: pointer;
}
Sinetheta
fonte
0

Acho que :hoverestava faltando nas respostas acima. Então, seguir seria o necessário. (Se o css fosse necessário)

#myDiv:hover
{
    cursor: pointer;
}
ser_etéreo
fonte
Funcionou para mim sem o: hover e, provavelmente, muitos mais, pois a resposta tem muitos votos positivos. Você experimentou?
dading84 de
sim, ignore esta resposta
being_ethereal