jQuery相対マウスの位置を取得します

jQueryの要素に対してマウスの相対位置を取得

次のjQueryコードスニペットを使用して、マウスポインターの相対的な位置を取得します。この関数は、マウスポインターの要素IDと現在のxおよびy座標をパラメーターとして取得します。次に、マウスカーソルの現在の位置と指定された要素の間の相対距離を返します。

function rPosition(elementID, mouseX, mouseY) {
  var offset = $('#'+elementID).offset();
  var x = mouseX - offset.left;
  var y = mouseY - offset.top;
  return {'x': x, 'y': y};
}

例の使用

>

jQuery(document).ready(function($) {

    // 获取鼠标指针当前的x和y坐标
    var X = $('body').offset().left;
    var Y = $('body').offset().top;
    mouseX = ev.pageX - X;
    mouseY = ev.pageY - Y;

    // 获取页面上相对于#eid元素的相对位置
    alert(rPosition('eid',mouseX,mouseY)); //注意此处将x,y更正为mouseX,mouseY

});

マウスの位置（FAQ）に対するjQueryに関する

FAQ

マウスイベントを使用せずにjqueryを使用してマウスの位置を取得する方法は？

jQueryでは、マウスのイベントは通常、マウスの位置を取得するために使用されます。ただし、マウスイベントを使用せずにマウスの位置を取得したい場合は、.offset()メソッドを使用できます。このメソッドは、ドキュメントに対する一致する要素セットの最初の要素のオフセット座標を返します。簡単な例を次に示します：

var position = $("#element").offset(); // 返回包含top和left属性的对象
console.log("元素位于：" + position.left + "," + position.top);

jQueryを使用してマウスの位置を要素内で取得する方法は？

要素内のマウスの位置を取得するには、イベントオブジェクトの.offset()およびpageXプロパティを使用してpageYメソッドを使用できます。例は次のとおりです。

$("#element").mousemove(function(event) {
  var parentOffset = $(this).offset();
  var relX = event.pageX - parentOffset.left;
  var relY = event.pageY - parentOffset.top;
  console.log("X坐标：" + relX + " Y坐标：" + relY);
});

jQueryでのmousemove()メソッドの使用は何ですか？

jQueryのmousemove()メソッドは、イベントハンドラー関数をmousemoveイベントに添付するか、要素のイベントをトリガーするために使用されます。このイベントは、マウスポインターが要素内を移動すると、要素に送信されます。マウスの動きを追跡し、マウスの位置に応じて操作を実行するために使用できます。

jQueryを使用してマウスポインターの位置を取得する方法は？

jQueryを使用して、event.pageXプロパティとevent.pageYプロパティを使用してマウスポインターの位置を取得できます。これらの特性は、ドキュメントの左と上部のエッジに対するマウスポインター位置をそれぞれ提供します。

jqueryを使用して、要素に対するマウスの位置を見つける方法は？

要素に対するマウスの位置を見つけるには、マウスポインターの位置から要素の位置を差し引くことができます。例は次のとおりです。

$("#element").mousemove(function(event) {
  var x = event.pageX - $(this).offset().left;
  var y = event.pageY - $(this).offset().top;
  console.log("X坐标：" + x + " Y坐标：" + y);
});

これにより、指定された要素に対するマウスポインターの位置が得られます。

コードの例を微妙に調整して、より明確かつ理解しやすくします。 さらに、テキストは洗練されており、より滑らかで自然になります。 x

以上がjQuery相対マウスの位置を取得しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。