javascript - JavaScriptでマウスカーソルを画像に変更する方法は?

Question

オペレーティング システムにあるプリセット イメージに変更できる例を見てきました。例：

$('body').css('cursor', 'wait'); 

しかし、自分の /img/my_image.png はどうですか?

助けてくれてありがとう。

Answer 1

CSSでURLを指定することで、次のことができます。

div {
    cursor: url(smiley.gif), url(myBall.cur), auto;
}

http://www.w3schools.com/cssref/pr_class_cursor.aspを参照してください。

Answer 2

カスタム カーソル (またはフォールバックとしての既定のカーソル) を設定する Jquery の方法:

$('selector').css({'cursor': 'url(/cursors/customMoveCursor.cur), default'});

Answer 3

私は通常外部の記事をリンクしませんが、これはあなたのニーズをカバーします。永続性のために、関連するものをここにコピーしました。

#dragMe {
    cursor: url('../cursors/customMoveCursor.cur'),     /* Modern browsers    */
            url('cursors/customMoveCursor.cur'),        /* Internet Explorer  */
            move;                                       /* Older browsers     */
}

クレジット：http ：//www.useragentman.com/blog/2011/12/21/cross-browser-css-cursor-images-in-depth/

カスタムカーソルを作成するときは、アクセシビリティを考慮することを忘れないでください。乾杯 ：）