有谁知道,我有一个可拖动项目应该可以捕捉到droppable项目。我有这个工作,但我似乎无法弄清楚的是,我希望可拖动的对象,一旦掉到可放置的对象上,自我对齐,使它刚好离开左侧。如下图所示。
有没有人知道用jQuerys draggable / droppable对象做到这一点的方法?
更新
以下是删除对象时的功能。
function handleCardDrop( event, ui ) {
var slotNumber = $(this).data( 'number' );
var cardNumber = ui.draggable.data( 'number' );
// If the card was dropped to the correct slot,
// change the card colour, position it directly
// on top of the slot, and prevent it being dragged
// again
//alert("Slot number: "+slotNumber+"\n Card Number: "+cardNumber);
//alert(cardNumber+":"+slotNumber);
if(cardNumber==slotNumber)
{
correctCards++;
}
ui.draggable.addClass( 'correct' );
ui.draggable.draggable( 'disable' );
ui.draggable.addClass( 'correct' );
ui.draggable.draggable( 'disable' );
$(this).droppable( 'disable' );
ui.draggable.css({'cursor':'default'});
ui.draggable.position( { of: $(this), my: 'left top', at: 'left top' } );
ui.draggable.draggable( 'option', 'revert', false );
}
答案 0 :(得分:2)
我找到了实现这一目标的方法。当我真正需要的是offset()函数时,我正在使用position()函数。这是我用于定位的代码片段。可拖动对象的高度稍微小一点,因此对于顶部我计算不同的大小然后将其除以2以使其在对象内居中。然后我将它设置为可拖动对象的一半可拖动。
var off = $( this ).offset();
off.top += (($( this ).height() - ui.draggable.height())/2);
off.left -= ui.draggable.width()/2;
ui.draggable.offset( off );