Question

i have some problems with dragable UI.
In some conditions i need to stop dragging. It is very dynamic. I try to give it more simple.

What i do:

drag : (function(e,ui){
           if (ui.position.left > 400){// in my example 400 is variable whitch calculates every drag event
                        return false;
      }            
}

But if i do this. When i returning false. All drag is stoping. And if i want to drag in another direction, i must do ‘mouseup’ and ‘mousedown’ again.

How can i create such behavior without stopping drag?
Thanks

Answer 1

There isn’t any method that cancels only one “dragging”, but you can set the position of the object using ui.position

return false

raises an error and it doesn’t work effectively. The following piece of code worked for me well.

$('#draggablediv').draggable({
        drag: function (event, ui) {
            if (your_condition) { // for example: ui.position.left < 100
                ui.position.left = ui.position.left_old
                ui.position.top = ui.position.top_old
            }
            ui.position.left_old = ui.position.left
            ui.position.top_old = ui.position.top
        }
    })