JSFiddle - React, Tailwind, and code Playground

HTML

<div>hey</div>

CSS

div{
    width:30%;
    border:4px solid green;
    resize:horizontal;
    overflow:hidden;
}

JavaScript

var ready = false; //entered with no clicks
$("div").on("mousemove",function(e) {
    var bottom = $(this).offset().top + $(this).outerHeight();
    var right = $(this).offset().left + $(this).outerWidth();

    if (e.pageY<bottom-3 && e.pageY>bottom-16 &&
        e.pageX<right-3 && e.pageX>right-16){
        if (e.which==1 && ready){console.log("drag started");ready=false;} //left click
        else if (e.which==0) {ready=true;console.log("ready");} //no clicks
    } else ready=false;
});
$("div").on("mouseout",function(e) {
    ready=false;
});