title: Jquery ui draggable and droppable: Snap an element to center of a grid
body: <p>I wanted to know how it's possible to snap an element to the center of the grid. In the fiddle you can see that the element snaps to the edges, not to the center. (How) is it possible to do a snap to the middle?</p>
  
  <p><a href="http://jsfiddle.net/CbESD/" rel="nofollow">http://jsfiddle.net/CbESD/</a></p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;div id="draggable"&gt;drag&lt;/div&gt;
  &lt;div id="droppable"&gt;drop&lt;/div&gt;
  </code></pre>
  
  <p>JS:</p>
  
  <pre><code>$('#draggable').draggable({
      snap: '#droppable',
      snapMode: 'inner'
  });
  
  $('#droppable').droppable({});
  </code></pre>