JSFiddle - React, Tailwind, and code Playground

HTML

<div class="debug"></div>
<div class="parent">
	<div class="child"></div>
</div>

CSS

.parent{
	position:relative;
	display:inline-block;
	width:400px;
	height:400px;
	margin:200px;
	padding:10px;
	background-color:#3F62FF;
}

.child{
	position:absolute;
	display:inline-block;
	width:200px;
	height:200px;
	margin:10px;
	padding:10px;
	background-color:#BFCAFF;
	top:20px;
	right: 20px;
}

JavaScript

$(document).ready(function($){
	$(".parent").mousemove(function(event){
        var pOffset = $(".parent").offset(),
            px = event.clientX - pOffset.left,
            py = event.clientY - pOffset.top;
        $(".debug").html("X: "+ px +"<br>Y: "+ py);
	});
});