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); });});

在线演示        积分下载        6毛下载        砍两刀下载