jQuery UI的地圖區域內拖動

我試圖做的div容器是圖像映射區域或檢查中拖動爲什麼我們離開的時候，元素被拖動的區域，這裏的例子：jQuery UI的地圖區域內拖動

the situation

我的第一個嘗試是關於監聽該區域的mouseleave/mouseout事件，但是當我將鼠標移動到可拖動元素上時，它們每次都會調用，而不是在我拖動此元素離開區域時調用。

此外，我曾嘗試使用{處理程序：$（「地圖」）}和{處理程序：$（「地圖區域」）}的選擇，但是當我開始拖動的元素消失。

下面是HTML代碼：

<div class="preview"> 
    <div class="image-wrapper ui-resizable ui-draggable" style="position: absolute;"> 
    <img src="img/image1.png" class="drag-image"> 
    <div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se" style="z-index: 90; display: block;"></div> 
    </div> 
    <img src="img/someimg.png" usemap="#imgmap2013112143545" class="bg-image" /> 
    <map id="imgmap2013112143545" name="imgmap2013112143545"> 
    <area shape="poly" alt="" title="" coords="117,75,144,94,229,113,276,113,358,89,381,75,395,123,316,203,281,245,269,239,247,239,238,241,234,246,179,192,141,158,112,121" href="/" target=""> 
    </map> 
</div>

現在我想一些全球mousemove事件，來檢查是元素拖動並沒有我們離開該地區。

你有任何想法，這可怎麼否則解決了嗎？

來源

2013-11-04 Kirill

您必須訂閱draggable的drag事件，並使用相對於碰撞區域的offset ui參數進行碰撞檢測。

Docs

來源

2013-11-04 12:02:20

對於拖動事件的Thx，我不知道它。但是如何計算非矩形區域的碰撞？ – Kirill

你有JSFiddle嗎？或一些工作代碼？ –

jQuery UI的地圖區域內拖動

回答

相關問題