【JavaScript】offsetX、offsetYって何？～要素上での座標ですよ～

初めてプログラミングやJavaScriptを勉強するときに
誰しもが混乱する「座標」の概念。

offsetX、offsetYについて、解説です。

例えば、図のように２つの要素があったとしましょう。

現在イベントが発生しているのは、もちろん手前の赤い方ですね。

そこでのX座標、Y座標について指定するのがoffsetX、offsetYという考え方です。