JQuery Draggable Helper克隆位置光標滾動後的位置偏移

目前我使用的是JQuery 2.0.3和JQuery UI 1.10.4。我正在嘗試使用Draggable API。我的可拖動項目列表超出了頁面的長度。在滾動後嘗試拖動項目時，該項目不再位於光標處。它顯示在光標下方。距離光標的距離隨着滾動距離的增加而增加。JQuery Draggable Helper克隆位置光標滾動後的位置偏移

在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>';

回波 '';

JS：

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

預先感謝您的任何和所有援助。

來源

2014-01-24 j.smith

請檢查以下jsFiddle。我首先使用了谷歌CDN，並能夠看到問題。但後來我更新了對Jquery UI JS和JQuery UI CSS的引用。您不需要添加css參考，但可以嘗試使用js參考並查看它是否適合您。

代碼仍然是相同的：

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

來源

2014-01-25 01:21:11 Siva

謝謝你這麼多的尋找到這一點。 jsFiddle似乎正在按照我的要求工作。我會用我的代碼嘗試修改後的JS文件，看它是否有效。出於好奇，你在JS文件中修改了什麼來糾正行爲？再次感謝你。 –

我沒有修改js文件中的任何內容。我想這是與你有什麼不同的版本... – Siva

非常感謝。我現在明白了。我使用的版本是生產版本1.10。您所引用的版本是預生產版本1.11。我更新了我的文件中的參考文獻，並且這些項目的行爲都符合要求。感謝您的幫助。 –

我面臨同樣的問題。我解決它，當我刪除appendTo：body。

試試這個代碼

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

來源

2014-02-18 16:22:04

JQuery Draggable Helper克隆位置光標滾動後的位置偏移

回答

相關問題