jQuery UI draggable only to left

jquery, jquery-ui, jquery-ui-draggable, pixel

Solution

It can be done with something like:

var startPosition = 0;
$('li').draggable({
    axis: 'x',
    start: function( event, ui ) {
        startPosition = ui.position.left;
    },
    drag: function( event, ui ) {
        if(ui.position.left > startPosition)
            ui.position.left = startPosition;
        if(ui.position.left < -250)
            ui.position.left = -250;
        startPosition = ui.position.left;
    }
});

Check This Example

Update

To allow a user to get back to the original position Link

Problem

How can I drag an element only to the left and only for X pixels? Obviously using jQuery UI Draggable. I've tried something like ``` $('li').draggable({ axis: 'x', containment: [0,0,-250,250] }); ``` But it doesn't do what I want.. EDIT: JSFiddle: http://jsfiddle.net/MJvn8/

Original source