Question

I want to add buttons somewhere on the page to manipulate JQuery Draggable element without mouse dragging, i.e. programmatically. In other words, I want to shift (or pan) draggable element inside its container up or down, left or right depending on what button user clicks. How can I do it? I cannot seem to find that option in docs. Do I simply manipulate CSS left/top to achieve it and make sure I do not go outside of the container?

$(".drag-view").draggable({drag:function(event, ui){containment:a /*...*/}});

Answer 1

You could draw the element on the screen and then use $.animate() to move it into position. The element would have to be positioned absolutely to animate in that fashion and would, as you mentioned, be a result of top and left.