jQuery UI:我怎么知道div以拖动事件为中心

Question

如果我有两个或多个div或p标签。我想知道如果我将"我是标题 H3"(这是我的 H3 标签(拖到"我是标题 H1"(这是我的 H1 标签(或"我是旁路图 p"(这是我的 p 标签(中的中心，我怎么能在我的小提琴示例中获得每个元素的中心(我将在下面提供(表明两个元素的中心其他。

var element = $(".draggable_element");
element.each(function() {
$(this).draggable({
zIndex: 999,
scroll: false,
refreshPosition: true,
});
});

这是我的小提琴。

Answer 1

下面的代码将帮助您在拖动时找到每个元素的中心。 https://jsfiddle.net/44ve3syv/4/

var element = $(".draggable_element");
element.each(function() {
$(this).draggable({
zIndex: 999,
scroll: false,
refreshPosition: true,
drag: function() {
console.log(1);
},
stop:function(){
checkIfCenter($(this));
}
});
});
checkIfCenter = function(el){  
var cPos;
var elCenter = findCentre(el);
var isCenter = true;
$( ".draggable_element" ).each(function() {
cPos = findCentre($(this));
console.log(cPos);
if(cPos.x == elCenter.x && cPos.y == elCenter.y && isCenter){
isCenter = true;
}else{
isCenter = false;
}
});
if(isCenter){
alert("All elements came in center");
}
}
findCentre = function(el){
var offset = el.offset();
var width = el.width();
var height = el.height();
var pos = { x : parseInt(offset.left + width / 2),y : parseInt(offset.top + height / 2)}
return pos;
}