JSFiddle - React, Tailwind, and code Playground

HTML

<div>&nbsp;</div>

CSS

div { background-color: gray; width: 300px; height:200px; }

JavaScript

$('div').mousemove(function(e){
           var parentOffset = $(this).parent().offset(); 
       //or $(this).offset(); if you really just want the current element's offset
       var relX = e.pageX - parentOffset.left;
       var relY = e.pageY - parentOffset.top;
        if(relX <= 10) $(this).css({'background-color':'red','cursor':'pointer'});
        else if(relX > ($(this).width() -10)) $(this).css({'background-color':'green','cursor':'pointer'});
        else
            $(this).css({'background-color':'gray','cursor':'auto'});
    });