JSFiddle - React, Tailwind, and code Playground

HTML

<div class="div_hover">
<div id="sq"></div>
</div>

CSS

.div_hover {
    width: 200px;
    height: 200px;
    border: 1px solid;
    background-image : url(http://krasivie-avatarki.ru/images/200x200/5-krasnyy-grustnyy-smaylik-v-okruzhenii-zheltyh.jpg)
}
#sq{
background: #ffffff;
width: 4px;
height: 4px;
text-align: center;
}

JavaScript

$(document).ready(function(){
  $('.div_hover').click(function(e){
    // положение элемента
    var pos = $(this).offset();
    var elem_left = pos.left;
    var elem_top = pos.top;
    // положение курсора внутри элемента
    var Xinner = e.pageX - elem_left;
    var Yinner = e.pageY - elem_top;
    alert("X: " + Xinner + " Y: " + Yinner);
    var  newCoord = {};
		newCoord.top = Yinner;
		newCoord.left = Xinner;
		return newCoord;
  });
});