JSFiddle - React, Tailwind, and code Playground

HTML

<div id="block"></div>

CSS

#block{
    width:100px;
    height:87px;
    overflow:hidden;
    background:url('http://s019.radikal.ru/i639/1204/c4/01207be20953.jpg') no-repeat;
}
#block2{
    width:100px;
    height:100px;
    background:url('http://i062.radikal.ru/1204/e2/260ce055811e.jpg') no-repeat;
    opacity:0;    
}

JavaScript

$("#block").hover(
    function(){
        $(this).html("<div id='block2'></div>");
        $("#block2").animate({opacity:1}, 3000);
    },
    function(){
        $("#block2").animate(
            {opacity:0},
            3000,
            function(){
                $(this).remove();
            });
    }
);