JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE HTML>
    <head>
        <meta charset="utf-8">
        <link href="style.css" rel="stylesheet" type="text/css" />
        <script src="jquery.js" type="text/javascript"></script>
        
        <script type="text/javascript">
            $(document).ready(function()
            {
                $(".box").hover(
                    function()
                    {
                        var content = $(this).find("img").attr("rel");
                        var c = content.split("|");
                        $(this).append("<div class=\"block\">" + c[0] + "<br><a href=\"http://" + c[1] + "\">" + c[1] + "</a></div>");
                        
                        $(this).find(".block").stop().animate(
                        {
                            bottom: '+=50'
                        }, 200);
                    },
                    function()
                    {
                        $(this).find(".block").stop().animate(
                        {
                            bottom: '-=55'
                        }, 200, function()
                        {
                            $(this).find(".block").remove();
                        });
                    }
                );
            });
        </script>
        
    </head>
    
    <body>
        <div class="box"><img rel="Ked slnko svieti, obloha je hned jasnejsia..|www.adresa.sk" src="http://www.glirp.sk/webdizajn/img/references/steward.sk-blueticketeshop-on.jpg"></div>
        <div class="box"><img rel="Ked slnko svieti, obloha je hned jasnejsia..|www.adresa.sk" src="http://www.glirp.sk/webdizajn/img/references/steward.sk-blueticketeshop-on.jpg"></div>
    </body>
</html>

CSS

/* CSS Document */

body
{
    font-family: Arial, Helvetica, sans-serif;
    font-size: 12px;
    margin: 40px;
    padding: 0;
}

.box
{
    position: relative;
    float: left;
    margin-right: 10px;
    border: solid 5px #CCC;
    line-height: 0;
    overflow: hidden;
}

.block
{
    position: absolute;
    left: 0px;
    bottom: -50px;
    background-color: #000;
    padding: 10px;
    width: 93%;
    line-height: 16px;
    color: #FFF;
    /*opacity: 0.7;*/
}

.block a
{
    color: #FFF;
    text-decoration: underline;
}