JSFiddle - React, Tailwind, and code Playground
HTML
<html>
<head>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script>
$(function(){
var tip = $('<div class="tip">');
$("#container div").on('mouseover', function(){
var _this = $(this);
var _tip = tip.clone();
var _position = _this.position();
_tip.css('left', _position.left + 63);
_tip.css('top', _position.top);
_tip.show();
$('body').append(_tip);
});
$("#container div").on('mouseout', function(e){
$('.tip').remove();
});
});
</script>
<style type="text/css">
.tip{
width:200px;
height:50px;
background-color:#333;
position:absolute;
}
#container{
width:100%;
border:1px solid;
float:left;
}
#container div{
width:50px;
height:50px;
border:1px solid;
margin:10px;
float:left;
background-color:#555;
color:#fff;
text-align:center;
}
</style>
</head>
<body>
<div id="container">
<div>A</div>
<div>B</div>
<div>C</div>
<div>D</div>
<div>E</div>
<div>F</div>
<div>G</div>
<div>H</div>
<div>I</div>
<div>J</div>
<div>K</div>
<div>L</div>
</div>
</body>
</html>