css: dragging image doesn't work in Firefox

I'm trying to move an image around when the user clicks the image and starts moving: DEMO It works in Chrome, but has strange behaviour in FF

HTML:

<div id="parent">
    <img .... >
</div>

And I handle the javascript as follows

JS:

var move = false, prevX;
$('img').on('mousedown', function(e) {
   move = true;
   prevX = e.pageX;
})
  .on('mousemove', function(e) {
      if (move === true) {
          var x = parseInt($(this).css('left')) + e.pageX - prevX;
          $(this).css('left', x);
          prevX = e.pageX;
      }
})
  .on('mouseup', function(e) {
      move = false;
});

(In my own code I do a little bit more because you are not allowed to move the image outside certain boundaries)

I don't know why, but in Firefox you can select the image and then it doesn't work anymore. Any suggestions how to fix this in FF ?