examples

basic usage

$('#photo1').dragncrop();

overflow + overlay

$('#photo2').dragncrop({overlay: true, overflow: true});

initial position

$('#photo3').dragncrop({position: { offset: [0.75,0]}});

vertical photo with instruction

$('#photo4').dragncrop({instruction: true});

event listeners

Drag to see events

$('#photo5').dragncrop({
  start: function(){
    $('#photo5-log').css('background', '#ccc')
  },
  drag: function(event, position){
    $('#photo5-log').html('Event: dragging. Postion (offset): ' + position.offset)
  },
  stop: function(e){
    $('#photo5-log').css('background', '#fff')
  }
});

chaining

$('#photo6-small').dragncrop({
  drag: function(event, position){
    $('#photo6-large').dragncrop('move', position);
  }
});
$('#photo6-large').dragncrop({
  drag: function(event, position){
    $('#photo6-small').dragncrop('move', position);
  }
});