キャンバス要素のクリックイベントをさまざまなモニタサイズで検出します。

Question

ハロースタックオーバーフローバディ、

今日の私の質問は、キャンバス（HTML）のクリックイベントです。私は自分のラップトップでキャンバスを使ってクールなゲームを作っています。私が作った要素のクリックイベントが必要でした。私はその問題を簡単に見つけたのは、素晴らしいjQuery $("canvas").click(function() {//Blah, Blah, Blah})を使用していましたが、ページの上端からキャンバスの上端まで、そしてページの左側からキャンバスの左側に変数を追加する必要がありました。しかし、私は、同じ変数を使ってコンピュータを変更し、モニタのサイズを変更した場合、変数を変更して補正する必要があるという問題を認識しました（キャンバスがページの左上にあるかどうかは関係ありません）。

クリックイベントを正確に発生させることはできますが、別のモニターサイズではどうすればできますか？これには別の解決策がありますか？

必要な場合は、例を挙げておきます。

編集：キャンバスは中央に配置されているため、モニタのサイズを変更すると、左右のピクセルが増減します。私が設定した変数は試行錯誤の結果であり、これは非常に信頼性がありません（私は知っています）。

Answer 1

ネイティブMouseEventプロパティoffsetXとoffsetYを使用すると、キャンバスの位置を基準にクリック位置を取得できます。

Here is a demo divを使用していますが、キャンバスではまったく同じです。