Question

目前我正在使用JQuery 2.0.3和JQuery UI 1.10.4。我正在尝试使用Draggable API。我的可拖动项目列表超出了页面的长度。在滚动后尝试拖动项目时，该项目不再位于光标处。它显示在光标下方。它与光标的距离随着我滚动的距离而增加。

此问题同时出现在Chrome和Firefox中，但在Safari中是正常的功能。我删除了所有CSS并且只保留了Draggable代码并且问题仍然存在。非常感谢您解决此问题的任何帮助。如果需要任何其他详细信息，请与我们联系。以下是HTML和JS段：

HTML（从PHP生成）：

echo '<div id="container">';
echo '<div id="category">';
    echo '<ul>';
        foreach ($items as $item) {
            echo '<li class="item">', $item['itemName'], '</li>';
        }
    echo '</ul>';
echo '</div>';

echo'';

JS：

$(function() {
    $('#category li').draggable({
        appendTo: 'body',
        helper: 'clone',
        connectToSortable: '#cart ul'
    });
 });

提前感谢您提供任何帮助。

Answer 1

检查以下jsFiddle。我首先使用谷歌CDN，并能够看到问题。但随后我更新了对Jquery UI JS和JQuery UI CSS的引用。您不需要添加css引用，但尝试使用js引用并查看它是否适合您。

代码仍然相同：

$(function() {
    $('#category li').draggable({
        appendTo: 'body',
        helper: 'clone',
        connectToSortable: '#cart ul'
    });
 });

Answer 2

我遇到了同样的问题。我删除appendTo：body时解析它。

试试这段代码

    $('#category li').draggable({
      helper: 'clone',
      connectToSortable: '#cart ul'
    });

滚动后光标上的JQuery Draggable Helper克隆位置偏移量

2 个答案: