Why jQuery droppable does not react on drop?

javascript droppable jquery draggable dnd

The most simple draggable plus droppable pair might work, or might work sometimes. The very reason for this situation, is that default tolerance for droppable is set to intersect. To gain more precision while dropping element, I recommend setting tolerance to pointer. This will trigger drop event on element directly below mouse pointer.

Example configuration

The example is in CoffeeScript, but the idea should be clear.

config =
  tolerance: "pointer"
  drop: onDrop
jQuery(element).droppable config