JSFiddle - React, Tailwind, and code Playground

HTML

<div class='leftbar'>Left Bar</div>

CSS

body.myclass{background:#F66; transition:0.2s background;}

JavaScript

$(document).ready(function(){
    var barTimeout = 0;
    $( ".leftbar" ).on({
        mouseenter: function(){
            barTimeout = setTimeout(function(){
                $( "body" ).addClass( "myclass" );
            }, 300);
        },
        mouseleave: function(){
            if( typeof barTimeout !== 'undefined' ) clearTimeout( barTimeout );
            $( "body" ).removeClass( "myclass" );
        }
    });
});