如何使用较小的克隆使JQuery可拖动？

我有一个大的元素，显示在屏幕上，我想能够下降到一个较小的下降目标。因此，我想减小可拖动克隆的大小，以匹配拖放目标的大小。我想把它做成动画会很好看。我似乎无法让较小的克隆在拖动时围绕光标居中。有什么想法吗？以下是我尝试过的一个例子：

---

哇，这比我想象的要多！以下是修复方法：

$( ".draggable" ).draggable({
    helper: 'clone',
    start : function(event, ui){
        ui.helper.animate({
            width: 80,
            height: 50,
            marginLeft: (300-80)/2 - (300/2 - event.offsetX),
            marginTop: (200-50)/2 - (200/2 - event.offsetY)
        });
    }, 
    drag : function(event, ui){

    }
});

$("#target").droppable({
    drop : function(event, ui) {
       console.log('dropped');     
    }
});

您需要考虑事件的位置，并根据两个大小拖动的中心之间的差异将其居中

---

.

到目前为止，最简单的方法是使用

cursorAt

选项，将“left”和“top”设置为收缩辅助对象尺寸的一半

$(".draggable").draggable({
    helper: 'clone',
    start: function (e, ui) {
        ui.helper.animate({
            width: 80,
            height: 50
        });
    },
    cursorAt: {left:40, top:25}
});

---

请注意，我将宽度和高度保留在那里，以便您可以看到发生了什么，但是

（300-80）/2-（300/2-event.offsetX）

实际上可以简化为

event.offsetX-40

，这更简单，而且可以实现。然而，它并没有完全相同的效果来设置向中心移动的动画。@Mikemarcci，你是对的，这里的收缩效果不如你的答案中的效果吸引人，尽管净效果是相同的。对我来说，这种方法的最大优势在于，助手不会在以后的某些情况下产生可能成为问题的利润。是的，我同意你的观点。如果对象在被丢弃后被破坏，那么使用边距是可以的，但是如果它在那之后的任何时间都会出现，那么你的解决方案是一个更好的主意。谢谢大家，这两种解决方案对我都有效。然而，当你在广场上下车时，你真的得到了一个下车事件吗？即使我增加了下降目标的大小，我也不会一直得到下降事件。我使用的是Chrome v.26。公平地说，我原来的fiddle也没有得到这个事件，所以不是您添加的内容导致的。我在可拖放配置中发现了“容差”选项。我把它设为指针，效果很好。我将标记简单的解决方案作为答案，因为它对我有效，但两者都是很好的方法。两人都投赞成票。

$(".draggable").draggable({
    helper: 'clone',
    start: function (e, ui) {
        ui.helper.animate({
            width: 80,
            height: 50
        });
    },
    cursorAt: {left:40, top:25}
});