Question

我正在测试jQuery可拖放对象和可拖放对象，并且对可拖放对象和可拖动对象的克隆的悬停行为有疑问。

文档说，可拖动项必须与可放置项重叠至少50％，以触发事件过多（默认公差）。就像我拖动项目本身一样，它的工作原理与上面描述的一样。

如果我拖动该项目的副本，则50％规则不起作用。在这种情况下，如果我从顶部垂直拖动，则克隆必须与可放置对象完全重叠100％。如果我从左侧拖动克隆，则悬停事件将很早以10％的速度触发。

这是怎么回事？

$("#eins").draggable({
            helper: "clone",
            opacity: 0.7,
            drag: function(event,ui) {
                     $(ui.helper).addClass("clone")
                },
            stop: function (event, ui) {
                    console.log("Dragging stoped")
                }
})

$("#zwei").droppable({
            classes: {"ui-droppable-hover": "draggableHover"},
            tolerance: "intersect",
            over: function(event, ui) {
                    console.log("hover")
                },
            drop: function (event, ui) {
                    console.log("dropped")
                }
})

#eins, .clone {
   background: coral;
   height: 100px;
   width: 100px;
   margin: 0px;
}

#zwei {
   background:lightgreen;
   height:100px;
   width: 100px;
   margin: 0px;
}

.draggableHover {
   background: rgb(230, 250, 230) !important;
}

<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.slim.min.js"></script>
<div id="eins">
   eins
</div>
<div id="zwei">
   zwei
</div>

Answer 1

解决方案：id =“ eins”的class =“ eins”接口。

带有可拖动帮助器的奇怪的可放置悬停效果

1 个答案: