Почему onmousemove даёт неправильные координаты?

var rotate = 0; 
var rFix = "45"; 
var zoom = "in"; 
var xScroll = 0; 
var yScroll = 0; 
 
function zoomFullSide(event) { 
  var cellZoomIn = 55 * 50; 
  var cellZoomOut = 11 * 50; 
  if (zoom === "in") { 
    $('.side-full-zoom').css({ 
      'height': cellZoomIn + 'px', 
      'width': cellZoomIn + 'px', 
      'cursor': 'zoom-out' 
    }); 
    $('.side-full').scrollTop(yScroll * cellZoomIn / 550); 
    $('.side-full').scrollLeft(xScroll * cellZoomIn / 550); 
    zoom = "out"; 
  } else if (zoom === "out") { 
    $('.side-full').css('overfow', 'hidden'); 
    $('.side-full-zoom').css({ 
      'height': cellZoomOut + 'px', 
      'width': cellZoomOut + 'px', 
      'cursor': 'zoom-in' 
    }); 
    zoom = "in"; 
  } 
} 
 
function drawZoneSelect(event) { 
  xScroll = Math.floor(event.offsetX / 10) * 10; 
  yScroll = Math.floor(event.offsetY / 10) * 10; 
  if (xScroll < 440 && yScroll < 440) { 
    $('#log').text('y: ' + event.offsetY + ' x: ' + event.offsetX); 
    $('.zone-select').css('top', event.offsetY); 
    $('.zone-select').css('left', event.offsetX); 
  } 
}

#modal-select-side { 
  position: fixed; 
  width: 100%; 
  height: 100%; 
  background-color: transparent; 
  transition: all 0.5s ease; 
  z-index: 10000; 
} 
 
#modal-select-side.animate { 
  background-color: rgba(0, 0, 0, 0.8); 
} 
 
#modal-select-side .side-full { 
  width: 550px; 
  height: 550px; 
  background-color: white; 
  position: absolute; 
  left: 50%; 
  top: 50%; 
  margin-left: -275px; 
  margin-top: -275px; 
  transform: scale(1); 
  transition: all 0.8s ease; 
  overflow: auto; 
} 
 
#modal-select-side .side-full .side-full-zoom { 
  width: 550px; 
  height: 550px; 
  cursor: zoom-in; 
  background: url(http://nn.by/img/w1500d4/photos/z_2015_10/cat-2un2u.jpg) no-repeat; 
  background-size: cover; 
} 
 
#modal-select-side .side-full #select-cell { 
  position: absolute; 
  top: 0; 
  left: 0; 
} 
 
#modal-select-side .side-full .zone-select { 
  width: 110px; 
  height: 110px; 
  background-color: rgba(20, 180, 0, 0.7); 
  position: absolute; 
} 
 
#modal-select-side .side-full.animate { 
  transform: scale(1); 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div id="log"></div> 
<div id="modal-select-side"> 
  <div class="side-full"> 
    <div class="side-full-zoom" onmousemove="drawZoneSelect(event)" onclick="zoomFullSide(event)"> 
      <div class="zone-select"></div> 
    </div> 
  </div> 
</div>