jQuery UI可排序 - 無法將元素拖動到連接列表/列的底部

Question

我遇到了jQuery排序問題。我正在使用它來創建3列來開發一個類似iGoogle的儀表板。所有3個都包含可排序的div，並使用connectWith選項相互連接。

我遇到的問題是當試圖在可排序列的底部放下div時;它只是不想發生。它只適用於拖過/拖過已拖放到列表中的最底部的div。

有什麼辦法可以避免這種情況？或者，也許要創建一個固定在每列底部的虛擬分區？任何對此的幫助將非常感謝！

在此先感謝。

Answer 1

老問題，但也許去幫助別人......

填充的作品，但改變你的視覺處理。

另一種解決方案是使用可排序api提供的'容差'。 「指針」的容差值意味着只要用戶光標在其他元素之上，該項目就可以替換其位置（而不是在元素上留出一定的空間，這就是沒有填充時有問題的原因） 。

嘗試添加到您的初始化（在我的例子中，我正在垂直排序列表）。

 $(this.$el).sortable({ 
      axis: 'y', 
      cursor: 'move', 
      containment: 'parent', 
      tolerance: 'pointer' // this is the important bit 
     }); 

這樣做後應該很活潑。

你也可以在這裏看到jQuery的文檔就可以了：

Answer 2

包含div的列需要相當大的padding-bottom來將可拖動區域擴展到底部div之外。否則，這些列會緊緊抓住div，並且每個底部div下方的區域位於可排序列表之外。