jQuery可拖動的圖像，當鼠標超出邊界（div）時停止拖動

我在div運行中有一個可拖動的圖像。不過，我想這樣做，如果用戶沒有拖動鼠標並拖動元素/ div，當鼠標移出div時，如果它的下降或邊界不再是可拖動的。當控件上按下按鈕時，拖動功能被啓用，該功能正常工作。我只是希望能夠在鼠標超出特定div /元素的界限時停止拖動。jQuery可拖動的圖像，當鼠標超出邊界（div）時停止拖動

這是組合控件的一部分，因此當頁面加載時，腳本將在頁面中註冊。

jQuery.fn.Draggable = function (button) { 

    if (button.value == "Off") { 

     button.value = "On"; 
     this.draggable({ cursor: "hand" }); 


    } else { 
     button.value = "Off"; 
     this.draggable("destroy"); 
    } 
} 

jQuery.fn.Drag = function (button) { 
    this.Draggable(button); 
}

在此先感謝。

編輯：

我用已經遏制，但我不想固定在div內的圖像。我希望圖像能夠跳出界限，但是當鼠標超出界限時，它將停止拖動。

所以當鼠標移出div框外時，停止拖動。我不想包含div內的對象。我已經對它進行了修補。

來源

2012-03-20 RiggleBits

爲什麼不使用jQuery UI中已有的可拖動功能：[http://jqueryui.com/demos/draggable/#constrain-movement]？我可能完全錯過了這一點:)！ – bm1729 2012-03-20 16:55:46

我編輯了我的原始問題更清楚一點。 – RiggleBits 2012-03-20 17:18:42

你可以註冊鼠標/鼠標事件在包含div啓用/禁用拖動功能？

$('div#container').mouseenter(function(event) { 
    // enable dragging 

}).mouseleave(function(event) { 
    // disable dragging 

});

來源

2012-04-26 17:00:13 pabo

我會盡力回覆你！謝謝 – RiggleBits 2012-04-30 08:58:58

jQuery可拖動的圖像，當鼠標超出邊界（div）時停止拖動

回答

相關問題