（固定高度）div 内的可拖动项目弄乱了 CursorAt 位置

Question

我有以下设置：

<asp:treeview cssclass="draggable"><items...>  <table />

我将它设置为能够使用 jQuery 将项目从树视图拖到表格中：

 $(".draggable").draggable({ helper: "clone", cursorAt: { left: -10, top: -10} }) 

因此，在拖动时，克隆的目的是保持在当前鼠标位置的下方，以便于用户使用。

但是，当打开的节点将它推到一个简单的内容页面之外时，我现在需要使树视图可滚动（垂直），否则拖放对用户来说太难了。

为此，我在树视图周围放置了一个可滚动的 div，如下所示：

<div style="padding-right: 20px; overflow: auto; overflow-x: hidden; height: 300px;"> <asp:treeview cssclass="draggable"><items...></div>  <table />

这按预期工作，但现在的问题是 - 在拖动时 - 克隆的元素不再位于鼠标位置下方，而是向下，这当然会让用户感到非常困惑。

我尝试删除 draggable() 方法的“cursorAt”属性，但这没有帮助。

所以看起来 div 的固定高度弄乱了克隆元素的位置......知道如何解决这个问题吗？

Answer 1

好的，答案是 CursorAt 将默认为拖动项的父项，在本例中已更改为 div。

所以把draggable()改成

 $("draggable").draggable({ helper: "clone", appendTo:'body', cursorAt: { left: -10, top: -10} }) 

解决了问题。