Ok, this should be easy for the right person: Is it possible to edit the revert position of a jQuery UI draggables helper? For example, I have icons the user can click and drag into groups on the page. When the user clicks an icon and starts dragging, a helper message appears right under their cursor and follows the cursor so long as they continue to hold the click. If the helper is dropped into a group, it disappears. If the helper is not dropped into a group, it returns to it's original position using revert: 'invalid'. My question is, can I edit that original position of the helper? It appears to always revert back to the absolute position of left: 0 and top: 0 but I can't figure out how to edit these values. I need to edit the return position to be about 300px more to the left. Any help would be appreciated.
A:
You can try repositioning the draggable element once the drag has started, when released the element will revert to the original position and then jump to the new position - I haven't figured out how to get around that, but this method works
$(document).ready(function(){
$(".dragMe").draggable({
helper : 'clone',
revert : true,
start: function(e,ui){
// when starting the drag, reposition the element
$(this).hide().css({ position: 'relative', left: '-300px', top: 0 });
},
stop: function(e,ui){
$(this).show();
}
});
$("#dropBox").droppable({
drop: function(e, ui) {
ui.draggable.appendTo($(this)).show()
// reset the position of the element to zero (so it fits in the drop box)
.css({ position: 'relative', left: 0 })
ui.helper.remove();
}
});
})
fudgey
2010-01-10 17:23:43