JSFiddle - React, Tailwind, and code Playground
HTML
<div class="blur pic"><img src="http://i.imgur.com/IGKVr8r.png" alt="plane" /></div>
<div id="blurr"></div>
CSS
.pic{
display:inline-block;
}
/*below CSS for the blurring div*/
#blurr{
position:absolute;
display:none;
width:30px;
height:30px;
background-color:rgb(240,240,240);
border-radius:50%;
-moz-border-radius:50%;
-webkit-border-radius:50%;
box-shadow:0px 0px 10px 10px white;
-moz-box-shadow:0px 0px 10px 10px white;
-webkit-box-shadow:0px 0px 10px 10px white;
opacity:0.8;
filter:alpha(opacity=80); /* For IE8 and earlier */
}
JavaScript
$('.pic').mousemove(function(event){
event.preventDefault();
var upX=event.clientX;
var upY=event.clientY;
$('#blurr').css({'display':'block','top':''+(upY-15)+'px','left':''+(upX-15)+'px'});
});