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的地图区域内拖动

回答

相关问题