jQuery可拖动,向左偏移

时间:2013-01-22 17:31:46

标签: jquery draggable droppable

有谁知道,我有一个可拖动项目应该可以捕捉到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 );
}

enter image description here

1 个答案:

答案 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 );