JSFiddle - React, Tailwind, and code Playground

HTML

<img src="http://www.gnu.org/graphics/gnu-and-penguin-color-300x276.jpg" class="main" />

<img src="http://www.gnu.org/graphics/gnu-and-penguin-color-100x92.jpg" class="small" />

CSS

img {
    position: absolute;   
    border: 1px solid black;
}
img#main {
    left: 10px;
    top: 10px;
}
img#small {
    left: 20px;
    top: 220px;
    display: none;
}

JavaScript

$(".main, .small").mouseenter(function() {
    $(".small:hidden").show();
}).mouseleave(function(e) {
    if(e.target.className != 'main' || e.target.className != 'small') {
      $('.small').hide();
    }
});;

/*$("#main").mouseleave(function() {
    if (! $("#small").is(":hover") ) {
        $("#small").hide();
    }
});

$("#small").mouseleave(function() {
    if (! $("#main").is(":hover") ) {
        $("#small").hide();
    }       
});*/