JSFiddle - React, Tailwind, and code Playground

HTML

<div class="box">
    <div class="mini">
    
    </div>
</div>

CSS

body {
  width:100%;
  height:600px;
  background-color:#f1f1f1;
}
.box {
  width:400px;
  height:400px;
  background-color:coral;
}
.mini {
  width:100px;
  height:100px;
  background-color:green;
}

JavaScript

let fn = null;
document.querySelector(".box").addEventListener("mousedown", function(e) {
		el = e.target;
    console.log(e.clientY);
   
    
    fn = setInterval(function() {
			elPos(e)
		}, 1000);
    
    window.addEventListener("mouseup", () => {
    	clearInterval(fn);
    })
})

function elPos(e) {
	console.log(e.target);
	console.log(e.clientY);
}