<ul>
<li>screenX/Y</li>
<li>clientX/Y</li>
<li>pageX/Y</li>
<li>offsetX/Y</li>
</ul>
<iframe height="300" style="width:100%" src="https://codepen.io/uotomizu/embed/BaRyXJb?defaultTab=result">
  See the Pen <a href="https://codepen.io/uotomizu/pen/BaRyXJb">
  </a> by uotomizu (<a href="https://codepen.io/uotomizu">@uotomizu</a>)
  on <a href="https://codepen.io">CodePen</a>.
</iframe>


* screenX/Y
* clientX/Y
* pageX/Y
* offsetX/Y

<iframe height="300" style="width: 100%;" scrolling="no" title="" src="https://codepen.io/uotomizu/embed/BaRyXJb?defaultTab=result" frameborder="no" loading="lazy" allowtransparency="true" allowfullscreen="true">
  See the Pen <a href="https://codepen.io/uotomizu/pen/BaRyXJb">
  </a> by uotomizu (<a href="https://codepen.io/uotomizu">@uotomizu</a>)
  on <a href="https://codepen.io">CodePen</a>.
</iframe>

offsetX/Y, clientX/Y, pageX/Y, screenX/Y - Click event of JavaScript