質問: ユーザーがマウスを動かさずにブラウザのカーソルを「待機」から「自動」に変更する このjqueryコードを使用して、ajax呼び出し中にマウスポインターをビジー状態(砂時計)に設定します...$('body').css('cursor', 'wait'); そして、これを通常に戻すための対応するコード...$('body').css('cursor', 'auto'); これは正常に動作します...一部のブラウザでは。firefoxとieでは、コマンドを実行するとすぐにマウスカーソルが変わります。これは私が望む動作です。chromeおよびsafariでは、マウスカーソルは、ユーザーがポインターを移動するまで「ビジー」から「自動」に視覚的に変化しません。消極的なブラウザーにマウスポインターを切り替える最良の方法は何ですか?
回答: まず第一に、あなたがあなたの体の中の任意のタグにカーソルが割り当てられている場合、$('body').css('cursor', 'wait');はそのタグのカーソルを変更しないことに注意する必要があります(私のように、私はcursor: pointer;すべてのアンカータグで)。この特定の問題に対する私の解決策を最初に見たいと思うかもしれません: カーソルがajax呼び出しを待つ 他の人が言ったように、ユーザーがwebkitブラウザーでマウスを動かすとカーソルが更新されるという問題については、実際の解決策はありません。そうは言っても、cssスピナーを現在のカーソルに動的に追加する場合は、まだ回避策があります。カーソルのサイズとスピナーが正しく配置されるかどうかがわからないため、これは完璧なソリューションではありません。カーソルに続くcssスピナー: [〜#〜] demo [〜#〜] $.fn.extend( { reset_on : function(event_name, callback) { return this.off(event_name).on(event_name, callback); } }); var g_loader = $('.loader'); function add_cursor_progress(evt) { function refresh_pos(e_) { g_loader.css({ display : "inline", left : e_.pagex + 8, top : e_.pagey - 8 }); } refresh_pos(evt); var id = ".addcursorprog"; // to avoid duplicate events $('html').reset_on('mousemove' + id, refresh_pos); $(window). reset_on('mouseenter' + id, function(){ g_loader.css('display', 'inline'); }). reset_on('mouseleave' + id, function(){ g_loader.css('display', 'none'); }); } function remove_cursor_progress(evt) { var id = ".addcursorprog"; g_loader.css('display', 'none'); $('html').off('mousemove' + id); $(window).off('mouseenter' + id).off('mouseleave' + id); } $('.action').click(add_cursor_progress); $('.stop').click(remove_cursor_progress); タッチデバイスかどうかも確認する必要がありますvar istouchdevice = typeof window.ontouchstart !== 'undefined';結論として、カーソルを使用するのではなく、静的なスピナーまたは読み込みプロセスを示す何かをページに追加することをお勧めします。