$(document).ready(function() {
var zoomMargin = 5;
function endZoom(e) {
$('.zoomer .large').css('left', '');
$('.scale').css('opacity', '');
}
function moveZoom(e) {
var x = e.pageX,
y = e.pageY,
w = $(this).width(),
h = $(this).height();
$('.large').css({
'background-position': (x / w * 100) + '% ' + (y / h * 100) + '%'
});
$('.scale').css({
'opacity': 1,
'left': Math.round((x / w) * (w - 103)),
'top': Math.round((y / h) * (h - 68))
});
}
function startZoom(e) {
$('.zoomer .large').css('left', $(this).width() + zoomMargin);
}
$('.small').on({
'mouseenter': startZoom,
'mousemove': moveZoom,
'mouseleave': endZoom
});
});