JSFiddle - React, Tailwind, and code Playground
HTML
<div class="test" contenteditable="true">
</div>
CSS
* {
padding: 0;
margin: 0;
box-sizing: border-box;
}
.test {
background: lightgrey;
width: 500px;
height: 100vH;
}
JavaScript
$(function() {
$(".test").mousemove(function(e) {
var offset = $(this).offset();
var relativeX = (e.pageX - offset.left);
var relativeY = (e.pageY - offset.top);
console.log("X: " + relativeX + " Y: " + relativeY);
});
});