Photo: jared
マウスオーバーしたときにカーソルを変えようと思うとJavaScriptを使うのが常套手段ですが、スタイルシートでも変更できるって知っていましたか?
ちょーカンタンにマウスオーバーしたときにカーソルを変更できるスタイルシート「cursor:」
cursor: pointer;
なにも難しいことはありません。マウスオーバーしたときにカーソルを変更したい部分に上のコードを追加するだけです。
このコードを追加すると、マウスオーバーしたときにI型だったカーソルが☞型のカーソルに変更してくれます。
ちなみに値を変更すれば、さまざまなカーソルに変更できます。
crosshairだったら十字、moveだったら十字矢印、waitだったら砂時計に変更可能です。
また以下のようにURLを当ててやればオリジナルのカーソルに変更も可能です。
cursor: url(https://wayohoo.com/cursol.gif), default;
ちょこんと載せてやるだけで実装できてしまうので、すごくカンタンです。今までJavaScriptで実装していた方はぜひ実装してみてください。