web-dev-qa-db-ja.com

href属性を持たないリンクに小さな手を表示するにはどうすればよいですか?

私はこのリンクを持っています<a>jander</a>

その上にマウスカーソルを置くと、小さな手の代わりに選択カーソルが表示されます。

小さな手を見せるための方法はありますか?

注:href = '#'を使用したくないのは、リンク(ajax関数を実行するリンク)をクリックすると、ページの上部に移動するためです。

20
ziiweb

次のようにカーソルのスタイルを設定します。

<a style="cursor:pointer;">jander</a>
37
Paddy

使用する

cursor: pointer;

要素のスタイルまたはクラスで。これは、aだけでなく、すべての要素で機能することに注意してください。

ちなみに、ハンドラーではいつでもreturn falseを使用して、href="#"で発生する問題を回避できます。

4
harpo

次のこともできます。

<a href="javascript:;">jander</a>

これにより、ページの上部へのスクロールが防止され、リンクにhref属性が保持されます(CSSがロックされている場合や、CMSが制限されている場合に最適です)。

3

すべてに設定したい場合<a>属性はこれをcssファイルに設定します。

a {
  cursor:pointer;
}
2
Nazrul Muhaimin

追加 style="cursor:pointer;"aタグに追加します。

2
Anthony Grist

Bootstrap を使用する場合、次のことができます。

<a role="button">jander</a>
1
Saket Mehta

JavaScriptのリンクを使用する場合は、_<a href="javascript:false">jander</a>_または<a href="#" onClick="ajaxFunction(); return false;">を使用することもできます。returnfalseはhref属性を「非アクティブ化」します

1
Simon Müller

インラインスタイルは避けてください!クラスを使用する

<style>
.no-href-but-gimme-pointer{cursor:pointer;}
</style>
<a class='no-href-but-gimme-pointer'>hover me for pointer, but don't click me -- i won't do anything!</a>
0
Joe Velez