JQuery的排序（用不同高度的物品）是麻煩

Question

問題

我有問題，我的排序列表與不同高度的幾個項目。當我試圖將較大的項目移動到第一個或最後一個位置（它們都有較小的對象）時，會發生此問題。如果我目前的成功取決於我點擊的大項目的位置並開始拖動。

如果我想將項目移動到較小的底部位置，我必須點擊靠近項目的底部才能使其工作，如果要將其拖動到頂部位置，我必須點擊靠近頂部。但我希望能夠通過點擊任何地方來拖動項目。

一些額外的信息

的項目不能在外面父拖動和家長只有大，因爲它必須是，如果它大於它的容器出現滾動。因此，如果我不將它拖放到物品的頂部，似乎我無法將較大的物品拖過第一個（較小）的物品。

我一直在試圖解決這個通過使用cursorAt和使用頂部：0和另一個測試使用底部：0但它似乎沒有任何區別（所以我可能誤會了如何使用它）。我目前使用容差：指針。

我可以繞過不能夠通過臨時排序與拖動項目的高度加高過程中較大的項目拖到最後一個位置的問題。但它並不總是有效，它不是一個很好的解決方案。不能拖動它到頂端的問題仍然出現？

我不能改變jQuery代碼爲jquery-sortable-with-containment-parent-and-different-item-heights

問： 我如何可以將較大的項目在頂部或底部位置，同時允許用戶在任何地方點擊項目？

感謝您的幫助！

Answer 1

這可能不是解決你的問題，但我想我會分享的一些嘗試我今天做的結果。我需要讓具有不同寬度的inline-block的圖片可排序的照片庫，並發現移動更廣泛的照片將是非常艱苦的工作，因爲佔位比我在動的項目少。最後我用這樣的：

container.sortable({ 
     placeholder: "photo placeholder", 
     start: function (event, ui) { 
      ui.placeholder.width(ui.item.width()); 
     } 
    }); 

自定義佔位符類是有保證的佔位符不被默認隱藏，並start事件確保佔位符是相同的寬度爲你準備的項目移動。這對我來說效果很好，在你的情況下，用高度代替寬度可能會奏效。

我也嘗試使用containment爲你所做的一切，並發現它有時使事情變得更難取決於行中的項目。像你這樣解釋，包括tolerance: "pointer"有助於緩解這些問題，但如果可能的話，除去containment通常會使UI更寬容。