How to make a jQuery draggable actually snap to an equally sized droppable

Question

I have my draggable and droppable setup correctly using jquery-ui. They are both the same size, so the draggable should fit nicely on to the droppable. Is there any way to make the draggable snap in to the middle of the droppable so as to completely cover it? It seems if I use the snap: parameter it just snaps to the edges, and not necessarily to the middle of the droppable.

Answer 1

Would this not do the job, give or take a pixel:

    drop: function(event, ui) { 
    $(ui.draggable).offset($(this).offset());
    }

Answer 2

Or since you're already using jQuery UI, there's the position method

drop: function(event, ui) { 
  ui.draggable.position({of: $(this)});
}