jquery - JQUERY: Jquery を使用して画像内のカーソルの位置を特定するにはどうすればよいですか?

Question

Jqueryを使用して、画像/写真(ルートは画像/写真の左上隅)内のカーソルの位置を特定するにはどうすればよいですか?

助けてください！この一連のコードの書き方がわかりません。

前もって感謝します！

Answer 1

LIVE DEMO

$('img').on('mousemove', function( ev ){

   var mPos= {
      X: ev.clientX-this.offsetLeft,
      Y: ev.clientY-this.offsetTop
   };

   console.log( mPos.X +" "+ mPos.Y );

});

使用に興味がない場合は、mousemoveeg:clickまたはその他の必要なイベントを使用します。

---

jQuery.on()メソッドを使用すると、event( ev) を登録して関数内に渡すことができます。

function( ev ){

object( var mPos) を作成してkeysXを設定するよりもY、mousemove イベントを格納し、要素の位置clientXをclientY差し引いた値 を格納します。offset(JS のthisキーワードはimg要素を参照します)。

格納されたオブジェクト値を取得するよりもmPos.Xor/and を使用しますmPos.Y