ホームページ >ウェブフロントエンド >フロントエンドQ&A >jquery はマウスの位置をどのようにして知るのでしょうか?
方法: 1. "$(document).mousemove(function(e){})" ステートメントを使用して、Web ページにマウス移動イベントを追加し、処理関数を設定します。処理関数では、「e.pageX」および「e.pageY」ステートメントを使用して、マウスの静止位置の X 軸と Y 軸の座標を動的に取得できます。
このチュートリアルの動作環境: Windows7 システム、jquery1.10.2 バージョン、Dell G3 コンピューター。
jqueryでは、「pageX」属性と「pageY」属性でマウスの滞在位置を取得できます。
pageX プロパティは、ドキュメントの左端を基準としたマウス ポインターの位置です。
pageY プロパティは、ドキュメントの上端を基準としたマウス ポインターの位置です。
つまり、返される値は、X 軸と Y 軸上のマウスの位置です。
ただし、「pageX」属性と「pageY」属性を使用して静的位置を取得するだけで、mousemove() を使用して動的座標を取得できます。
例:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <script src="js/jquery-1.10.2.min.js"></script> <script type="text/javascript"> $(document).ready(function() { $(document).mousemove(function(e) { $("span").text("X: " + e.pageX + ", Y: " + e.pageY); }); }); </script> </head> <body> <p>鼠标指针位于: <span></span></p> </body> </html>
[推奨学習: jQuery ビデオ チュートリアル、Web フロントエンド ビデオ ]
以上がjquery はマウスの位置をどのようにして知るのでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。