JSFiddle - React, Tailwind, and code Playground

HTML

<div style="height:100%;">
<div id="abs">absolute</div>
<div id="relw">relative win</div>
<div id="relb">relative body</div>
</div>

CSS

html { margin:10px; border:5px #558 solid; padding:10px; background:#eff; }
body { margin:10px; border:5px #888 solid; padding:10px; background:#efe; }

JavaScript

$(document).bind('mousemove', function(e) {
    $('#abs').text('Event X,Y: '+e.pageX+","+e.pageY);
    
    $('#relw').text('Relative window X,Y: ' +(e.pageX/$(window).width())+
                   ","+(e.pageY/$(window).height()));
    
    $('#relb').text('Relative body X,Y: ' +(e.pageX/$('body').width())+
                   ","+(e.pageY/$('body').height()));
});