在可放置动画完成之前防止切换发生

Question

我拥有的：

使用jQuery UI，我将div从一个div拖放到另一个div。

丢弃事件触发：

1. 一个动画，可以将丢弃的div缓解/捕捉到位。
2. 另一个div的切换（显示/隐藏）。

问题：

在动画完成之前进行切换。我需要在动画完成时 AFTER 进行切换。

实例+代码：

http://jsfiddle.net/dominornovus/3Hq3q/2/

我尝试了什么：

我未能成功使用动画选择器：

$(":animated").promise().done(function() {
//code here
}

我的问题：

如何防止在可放置动画之前发生切换。

Answer 1

使用animate()中的回调：

$('.drop').droppable({
    tolerance: 'intersect',
    drop: function(event, ui) {
        var drop_p = $(this).offset();
        var drag_p = ui.draggable.offset();
        var left_end = drop_p.left - drag_p.left + 1;
        var top_end = drop_p.top - drag_p.top + 1;
        ui.draggable.animate({
            top: '+=' + top_end,
            left: '+=' + left_end
        }, function() {  //callback
            $(".somediv").toggle();
        });
    }
});

FIDDLE