jquery可拖动防止重叠

【问题标题】：jquery draggable prevent overlapjquery可拖动防止重叠
【发布时间】：2014-10-16 02:16:39
【问题描述】：

我正在创建一个网站，其中两个 div 在拖动时不应相互重叠。我创建了一个jsFiddle file

以下是代码

$(".butNotHere").draggable({
    obstacle: ".butNotHere",
    preventCollision: true,
    containment: "#moveInHere"
});

我想为两个 div 使用相同的类名提前致谢。

【问题讨论】：

标签： jquery jquery-draggable

【解决方案1】：

我想出了一种“黑客”来解决这个问题。这里的问题是拖动的 div 是它自己的障碍（都共享同一个类）。所以我所做的是在拖动开始时删除类 "" 并在停止时重新添加它。 jsFiddle

$(".draggable").draggable({
    obstacle:".butNotHere",
    preventCollision: true,
    containment: "#moveInHere",
    start: function(event,ui) {
        $(this).removeClass('butNotHere');
    },
    stop: function(event,ui) {
        $(this).addClass('butNotHere');
    }
});

【讨论】：