web-dev-qa-db-ja.com

(jQueryを使用して)イベント外のマウス位置を決定しますか?

このチュートリアル のように(できれば)jQueryを使用して、JavaScriptイベントの外部でマウスの絶対位置/座標(XおよびY)を取得する必要があります。ありがとうございました。

38
pbz

ありえない。ただし、チュートリアルで同じアプローチを使用して、位置をグローバル変数に保存し、イベントの外部で読み取ることができます。

このような:

jQuery(document).ready(function(){
   $().mousemove(function(e){
      window.mouseXPos = e.pageX;
      window.mouseYPos = e.pageY;
   }); 
})

どこからでもwindow.mouseXPoswindow.mouseYPosを使用できるようになりました。

47
Chetan Sastry

これは Chetan Sastry's answer に対するコメントとして始まりましたが、答えとして投稿する価値があるかもしれないことに気付きました。

カーソル位置のみをポーリングしている場合でも、常に実行されるドキュメントレベルのmousemoveイベントに注意してください。これは大量の処理であり、ブラウザ、特にIEのような低速なブラウザを動かなくなる可能性があります。

このような問題は、ほぼ間違いなく設計上の決定の問題を提起します。カーソル位置をポーリングするためにマウスイベントを処理する必要がない場合、本当にカーソル位置が必要ですか?解決しようとしている問題を解決するより良い方法はありますか?

編集:Safari 4でも(控えめに言って)非常に高速であり、その単一のmousemoveイベントはそのチュートリアルページとのすべての対話を顕著に行います私にとっては途切れ途切れです。それがサイトまたはアプリケーションのユーザーの認識にどのように影響するかを考えてください。

29
eyelidlessness

この関数は、一定の間隔でマウスの位置を取得するだけで、UIパフォーマンスへの影響を減らします。

function getMousePosition(timeoutMilliSeconds) {
    // "one" attaches the handler to the event and removes it after it has executed once 
    $(document).one("mousemove", function (event) {
        window.mouseXPos = event.pageX;
        window.mouseYPos = event.pageY;
        // set a timeout so the handler will be attached again after a little while
        setTimeout(function() { getMousePosition(timeoutMilliSeconds) }, timeoutMilliseconds);
    });
}

// start storing the mouse position every 100 milliseconds
getMousePosition(100);

他の回答と同じように、「window.mouseXPosおよびwindow.mouseYPos どこからでも。"

間隔中にマウスの動きが検出されないため、少し正確さが失われます。

10
Wahtah

@Chetan Sastryの解決策を試しましたが、機能しません(jQuery 1.6.4を使用しています)。私はコードを変更し、それから私は今働いています。これが私のコードです。これが役立つことを願っています。



    $(document).ready(function(){
       $(document).mousemove(function(e){
          window.mouseXPos = e.pageX;
          window.mouseYPos = e.pageY;
       }); 
    });

1
Sword-Breaker