JSFiddle - React, Tailwind, and code Playground
HTML
Move Background
<br />
<div id="salone"></div>
<div id="myDiv"></div>
CSS
#salone {
height:410px;
width:650px;
background:url(http://metamorfosi-parrucchiere.com/beta/images/salone.jpg);
background-repeat:no-repeat;
}
JavaScript
$("#salone").bind('mousemove', function (e) {
var url = $('#salone').css('background-image').replace('url(', '').replace(')', '').replace("'",'').replace('"', '').replace('%22', '').replace('\"','');
var bgImg = $('<img />');
bgImg.hide();
scope = this;
bgImg.bind('load', function()
{
scope.height = $(this).height();
scope.width = $(this).width();
});
$('#myDiv').append(bgImg);
bgImg.attr('src', url);
var centerX = scope.width/2;
var centerY = scope.height/2;
$(this).css({
backgroundPosition: (e.pageX-centerX) + 'px ' + (e.pageY-centerY) + 'px'
});
});