Arjun Arjun - 19 days ago 5
jQuery Question

Reset jquery draggable object to original position by clicking a button

I want to reset some draggable objects to its original position by clicking a button.
i can move and find current position. But how to reset them by clicking "Reset" button? It is all inside a container.
Can anyone help me?

Check this FIDDLE

var coordinates = function(element) {
element = $(element);
var top = element.position().top;
var left = element.position().left;
$('#results').text('X: ' + left + ' ' + ' Y: ' + top);
}


$('#custombox').draggable({ containment: "#containment-wrapper", scroll: false,
start: function() {
coordinates('#custombox');
},
stop: function() {
coordinates('#custombox');
}

});

$('#logo').draggable({ containment: "#containment-wrapper", scroll: false,
start: function() {
coordinates('#logo');
},
stop: function() {
coordinates('#logo');
}

});
$("#logo").resizable({ containment: "#containment-wrapper", scroll: false,maxHeight: 250, maxWidth: 350, minHeight: 50, minWidth: 50 });

VJS VJS
Answer

Assuming you want to trace back the steps.

I pushed the positions onto a stack and pop and retrieve the previous positions on click of reset buton.

$("#previousPos").on('click', function(){
    var pos = posStack.pop();
    $('#logo').css("left", pos.x);
    $('#logo').css("top", pos.y);
});

check the fiddle

----- Edit ---- Fixing the coordinate issue

New fiddle