JSFiddle - React, Tailwind, and code Playground

HTML

<div class="images">
                  <a href="#" img_src='http://dummyimage.com/150x75/000/fff&text=preview' class="pimg">View Testimonial</a>
            </div>

CSS

#pimg{position:absolute;display:none;width:auto;}
#pimg img {width:500px;}

JavaScript

function pimg()
{
    this.xOffset = 5;
    this.yOffset = 50;
    $("a.pimg").hover(function (e)
    {
        this.img_title = this.title;
        this.title = "";
        var img_src = $(this).attr('img_src');
        var desc = (this.img_title != "") ? "<h3>" + this.img_title + "</h3>" : "";
        var image = (img_src) ? img_src : this.src;
        $("body").append("<div id='pimg'><img src='" + image + "' alt='Image preview' />" + desc + "</div>");
        $("#pimg").css("top", (e.pageY - xOffset) + "px").css("left", (e.pageX-200 - yOffset) - "px");
        $("#pimg").fadeIn(700);
    }, function ()
    {
        this.title = this.img_title;
        $("#pimg").remove();
    });
    $("a.pimg").mousemove(function (e)
    {
        $("#pimg").css("top", (e.pageY + xOffset) + "px").css("left", (e.pageX-200 - yOffset) - "px");
    });
};

pimg();