JSFiddle - React, Tailwind, and code Playground

by charaf11

HTML

<script src="http://cherne.net/brian/resources/jquery.hoverIntent.minified.js"></script>
<div class="menu-item"></div>
<div class="the-dropdown"></div>

CSS

.menu-item {
    width:100px;
    height:100px;
    background-color:red;
}
.the-dropdown {
    position:absolute;
    top:100;
    width:100px;
    height:100px;
    background-color:blue;
    display:none;
}

JavaScript

$("div.the-dropdown").delay( 1000 ).show( 300 );

$('.menu-item , .the-dropdown').hover(
    function(){
               $("div.the-dropdown").show( 300 );
              }
    , function(){
              $("div.the-dropdown").hide( 300 );
              }
);