使用頻度が高くないので、毎回忘れてググっているのでまとめ。
CSS でマウスポインターの形状を変更する方法についてです。
例えば、指定した div 要素にマウスオーバーした際に、ポインターを矢印ではなく指差しのアイコンに変更したい時などに使用します。
ポインターの種類とサンプルについてはこちらを参考にしました。
サンプルコードは下記のとおりです。
使用するプロパティは cursor です。
<div id="pointer"> マウスポインターに「pointer」を指定 </div>
#pointer {
cursor: pointer;
}
上記を実行すると、div 要素にマウスカーソルを合わせたときに、ポインターが通常の矢印からリンクカーソルに変更されます。
他にも十字カーソルや、ローディングカーソル、移動カーソルにも変更できますので、任意で変更してください。
以上、CSS でマウスカーソルを任意の形状に変更する方法についてでした。
ご参考になれば幸いです。
