JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
<input type="radio" id="radiobtn"/>Hi
<div id="hoverbox">This is a hover box</div>
</div>

CSS

#hoverbox{
 display:none;
width:200px;
 height:200px;
color:#000;
    background-image: url(http://www.w3schools.com/css/paris.jpg);
 position:absolute;    
}
#text{
 width:100px;
height:100px;
 background:#000;      
}

JavaScript

$(document).ready(function(){

$('#container').on('mouseenter', '#radiobtn', showBox);
$('#container').on('mouseleave', '#radiobtn', hideBox);

function showBox(e){
var x = e.pageX + 20;
var y = e.pageY + 20;
    $('#hoverbox').fadeIn();
    $('#hoverbox').offset({ left: x, top: y });
}
});
function hideBox(){
$('#hoverbox').fadeOut();
}