JSFiddle - React, Tailwind, and code Playground

HTML

<div id="dropdown_shopping_cart"></div>

CSS

#dropdown_shopping_cart{
    position: absolute;
    width:100%;
    height:50px;
    top:0;
    left:0;
    background-color:green;
    display:none;
}

JavaScript

var hide_div_to;

function hideDiv(){
    hide_div_to = setTimeout(function () { 
        $('#dropdown_shopping_cart').slideUp(800);
    }, 6000);
}

$('#dropdown_shopping_cart').slideDown(800,hideDiv());

$('#dropdown_shopping_cart').mouseenter(function(){
     clearTimeout(hide_div_to);
});

$('#dropdown_shopping_cart').mouseleave(function(){
     hideDiv();
});