将光标更改为手指指针

Dvi*_*evy 214 html css mouseevent

我有这个a,我不知道我需要插入"onmouseover",以便光标将像常规链接一样更改为手指指针:

<a class="menu_links" onclick="displayData(11,1,0,'A')" onmouseover=""> A </a>
Run Code Online (Sandbox Code Playgroud)

我读到了我需要放的地方:

onmouseover="cursor: hand (a pointing hand)"
Run Code Online (Sandbox Code Playgroud)

但这对我不起作用.

另外,我不确定这是否被视为JavaScript,CSS或纯HTML.

Sco*_*ott 438

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

这是css.

或者在样式表中:

a.menu_links { cursor: pointer; }
Run Code Online (Sandbox Code Playgroud)

  • 测试完之后,似乎有必要同时使用onmouseover =""AND style = cursor:pointer;".如果你只有样式标记,指针指针光标将在一次点击交互后消失/默认为标准指针.好帖斯科特,谢谢. (2认同)

Jos*_*ber 49

你可以用CSS做到这一点:

a.menu_links {
    cursor: pointer;
}
Run Code Online (Sandbox Code Playgroud)

这实际上是链接的默认行为.你必须以某种方式在CSS的其他地方覆盖它,或者那里没有href属性(你的例子中缺少它).

  • @DvirLevy - 所以要么返回false并使用`href ="#"`,要么就像我给你看的那样使用CSS ... (2认同)

小智 20

如果我在页面上只有一个链接,我喜欢使用这个:

onMouseOver="this.style.cursor='pointer'"
Run Code Online (Sandbox Code Playgroud)


Man*_*ola 8

在css写

a.menu_links:hover{ cursor:pointer}
Run Code Online (Sandbox Code Playgroud)


Mic*_*iro 7

如果你想加倍努力,这里有一些很酷的东西.在网址中,您可以使用链接或保存图像png并使用该路径.例如:

URL( '资产/ IMGS/theGoods.png');

以下是代码:

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

因此,这只能在128 X 128的尺寸下工作,任何更大的图像都不会加载.但你几乎可以使用你想要的任何图像!这将被认为是纯css3和一些html.你在html中所要做的就是

<div class='cursor'></div>
Run Code Online (Sandbox Code Playgroud)

并且仅在该div中,该光标将显示.所以我通常将它添加到body标签中.


Jar*_*oyd 6

我认为上面的"最佳答案"虽然在编程上是准确的,但实际上并没有回答所提出的问题.该问题询问如何更改鼠标悬停事件中的指针.我看到有关如何在某处发生错误的帖子没有回答这个问题.在接受的答案中,mouseover事件为blank(onmouseover=""),并且包含样式选项.令人困惑的是为什么这样做.

查询者的链接可能没有任何问题.考虑以下html:

<a id=test_link onclick="alert('kinda neat);">Click ME!</a>
Run Code Online (Sandbox Code Playgroud)

当用户鼠标悬停在此链接上时,指针将不会变为手...而是指针的行为就像它悬停在普通文本上一样.人们可能不希望这样......所以,需要告诉鼠标指针改变.

正在寻求的答案是这个(由另一个人发布):

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

然而,这是......如果你有很多这样的噩梦,或者在整个地方使用这种东西并决定做出某种改变或遇到错误.最好为它制作一个CSS类:

a.lendhand {
  cursor: pointer;
}
Run Code Online (Sandbox Code Playgroud)

然后:

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

还有很多其他方法可以说比这种方法更好. DIV,BUTTON,IMG等可能会更有用.不过,我觉得使用没有坏处<a>...</a>.

jarett.