jQuery 拖拽吸附效果

 $('#drag .drg').draggable({
    cursor: 'move',          // sets the cursor apperance
    revert: 'invalid',       // makes the item to return if it isn't placed into droppable
    revertDuration: 900,     // duration while the item returns to its place
    opacity: 0.35            // opacity while the element is dragged
  });

  // define options for droppable
  $('#drop').droppable({
    accept: 'img.drg',            // accept only images with class 'drg'
    activeClass: 'drp',           // add class "drp" while an accepted item is dragged
    drop: function(event, ui) {
      // after the draggable is droped, hides it with a hide() effect
      ui.draggable.hide(1000);
    }
  });

  // when the "#sw" element (inside the "#drop") is clicked
  // show the items with class "drg", contained in "#drag"
  $('#drop #sw').click(function(){
    $('#drag .drg').slideDown(1000);
  });
});