JSFiddle - React, Tailwind, and code Playground

by Owais Kiani

HTML

<div class="one">Show</div>
<div class="two">hello</div>

CSS

.one{
    border: 1px solid #000;
    width: 50px;
}
.two{
    width:50px;
    height:50px;
    border: 1px solid #000;
    display:none;
}

JavaScript

$(".one").mouseover(function () {
    $(".two").show();
});
$(".one").mouseleave(function () {
    if($(".two").is(":hover")){
    }else{
        $(".two").fadeOut();
    }
});
$(".two").mouseleave(function () {
    if($(".one").is(":hover")){
    }else{
        $(".two").fadeOut();
    }
});