My solution might not be the most elegant (maybe someone can provide something more intuitive?), but it seems it works ;)
Fiddle: http://jsfiddle.net/W9Z46/14/
(function ($) {
var lastPlace;
$("#choises li img").draggable({
revert: true,
zIndex: 10,
snap: "#answers li",
snapMode: "inner",
snapTolerance: 40,
start: function (event, ui) {
lastPlace = $(this).parent();
}
});
$("#answers li").droppable({
drop: function (event, ui) {
var dropped = ui.draggable;
var droppedOn = this;
if ($(droppedOn).children().length > 0) {
$(droppedOn).children().detach().prependTo($(lastPlace));
}
$(dropped).detach().css({
top: 0,
left: 0
}).prependTo($(droppedOn));
}
});
})(jQuery);
As you can see I'm just keeping the place you started draggin from in a variable lastPlace
and later when you drop and check something is there, you place it in the place you started dragging before.