JSFiddle - React, Tailwind, and code Playground

HTML

<div id="my_div"></div>

CSS

#my_div { margin: 50px; background: red; width: 300px; height: 300px; }

JavaScript

var timer, myDiv = $('#my_div');

$(document).on('mousemove', function(ev) {
    var _self = $(ev.target);
    
    clearTimeout(timer);
    
    if (_self.attr('id') === 'my_div' || _self.parents('#my_div').length) {
        return;
    }    
    
    if(!myDiv.hasClass('show')) {
       myDiv.fadeIn();
    }          
    
    timer = setTimeout(function() { 
        myDiv.fadeOut(1000, function() {
            myDiv.removeClass('show');
        });
    }, 1960);    
});