jQuery UI draggable, stop drag but let dragging the other way

Question

The problem is quite simple, take a look at this

$("#element").draggable({
    axis: "x",
    drag: function(event, obj){
        if(condition)
            return false;
    }
});

As you can see if condition is true dragging will be stopped and it won't be possible to continue dragging to any direction unless mouse key is released and pressed again.

So the question is how can I stop user dragging element to some direction without stopping drag to any other directions?

Answer 1

Try this, just reset back the position to 0.

$(function() {
    $( "#draggable" ).draggable({ 
        axis: "y",
        drag: function(event, obj){
            if(obj.position.top > 0){
               obj.position.top = 0;
            }
        },

    });

 });

See demo here