JSFiddle - React, Tailwind, and code Playground

HTML

<div id="div" style="width: 250px; height: 300px; border: 1px solid blue">hover</div>

JavaScript

$(document).ready(function () {
    $('#div').mousemove(function (e) {
        var div = $('#div');
        var x = e.pageX; // Mouse position X (relative to window)
        var y = e.pageY; // Mouse position Y
        var w = div.width(); // Width of box
        var h = div.height(); // Height of box
        var xO = div.offset().left; // X position of box (relative to window)
        var yO = div.offset().top; // Y position of box
        
        var left = w/h*(yO-y)+xO+w > x;

        $('#div').html(left ? 'left' : 'right');
    });
})