Reputation: 5815
In Jquery UI I can configure an element as draggable by invoking
$("#drag").draggable();
But is there a way to start and stop the drag functions manually from another function? Ie
someOtherFunction = function() {
$("#drag").startdrag();
}
yetAnotherFunction = function() {
$("#drag").stopdrag();
}
Upvotes: 12
Views: 10469
Reputation: 7664
I didnt find a way to trigger dragging manually, but I have found a workaround for my similar situation.
I had this situation with two overlapping images (see image below), both partially transparent. In draggable's start(event) I wanted to check if it hits transparent pixels. If so, I looked under it for another element to see if that one was hit. And if it was, I wanted to initiate its dragging.
Solution? I reorder images on mousemove, and draggable is then triggered for that topmost image.
For pixel-precise element selection, see my another answer in: registering clicks on an element that is under another element
Upvotes: 1
Reputation: 61
to stop the dragging you just have to return false in the dragging callback, something like this:
$("#unlock-handle").draggable({axis:'x', containment:'parent', drag:onDrag});
...
var onDrag = function(e) {
if ($(this).position().left > 200) return false;
};
Hope it helps :-)
Upvotes: 1
Reputation: 266
Answers above seem overcomplicated.
$('.nonDraggableObjectWhichTriggersDrag').mousedown(function(e) {
$('.draggableObject').trigger(e);
});
Upvotes: 13
Reputation: 31860
Drag start is started via script looking at mouse events. mouse down followed by a mouse move. If you can simulate those mouse movements via Javascript (I don't know where, how, or even if this is possible), then it should fire off the start of a drag.
Note: just found that YUI has a way to simulate mouse moves and mouse clicks. Check out http://developer.yahoo.com/yui/yuitest/#useractions
Upvotes: 1