JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://www.kfsoft.info/home/MyFadeOverImage/jquery.MyFadeOverImage.js"></script>
<div class="kwadraty-post2">	<a href="#">

        <img class="img" src="http://i.imgur.com/Nkpg0Iq.jpg"/>
           <p>HOVER ME HOVER ME HOVER ME HOVER ME </p>
	</a>

</div>

CSS

img {
    width:300px;
}
.kwadraty-post2 p {
    padding: 0px 10px;
    position: absolute;
    top:40px;
    background-color: rgba(255, 255, 255, 0.5);
    height:100px;
    font-size: 16px;
    left: 0;
    display:none;
}

JavaScript

$(document).ready(function () {
    $(".kwadraty-post2").MyFadeOverImage({
        normalAlpha: 0.5,
        hoverAlpha: 1,
        normalToneColor: "#000",
        imageWidth: 'auto',
        imageHeight: '100%'
    });
$(".kwadraty-post2").hover(function () {
        $(".kwadraty-post2 p").toggle("slow");


    });

});