jquery-ui – JQuery可排序(具有各种高度的项目)移动到第一个或最后一个位置很麻烦

问题

我的可排序列表存在问题,其中有几个不同高度的项目.当我试图将较大的项目移动到第一个或最后一个位置(两个都有较小的对象)时,会出现问题.如果我目前成功,很大程度上取决于我点击的较大项目的位置并开始拖动.

如果我想将项目移动到较小的底部位置,我必须单击靠近项目的底部才能使其工作,如果我想将其拖动到顶部位置,我必须紧靠顶部.但我希望能够通过点击任意位置来拖动项目.

一些额外的信息

这些项目不能在父项之外拖动,而父项目只有它必须大,如果它比它的容器大,则会出现滚动.因此,如果我不将它拖动到项目的顶部,我似乎无法将较大的项目拖过第一个(较小的)项目.

我一直试图通过使用cursorAt并使用top：0和另一个使用bottom的测试来解决这个问题：0但它似乎没有任何区别(所以我可能误解了如何使用它).我目前正在使用容差：指针.

我可以绕过在排序过程中不能通过临时将较大的项目拖动到最后位置的问题,随着拖动项目的高度增加高度.但它并不总是有效,它不是一个很好的解决方案.还没有出现无法将其拖到顶部的问题？

我无法像jquery-sortable-with-containment-parent-and-different-item-heights那样更改JQuery代码

题：
如何将较大的项目拖动到顶部或底部位置,同时允许用户单击项目上的任何位置？

谢谢你的帮助！

解决方法

这可能无法解决您的问题,但我想我会分享我今天所做的一些实验的结果.我需要制作一个带有不同宽度的内嵌块图片的可排序照片库,并发现移动更宽的照片真的很难,因为占位符小于我移动的项目.我最终使用了这个：

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

自定义占位符类用于确保默认情况下不占用占位符,并且start事件确保占位符与您要移动的项目的宽度相同.这对我来说效果很好,在你的情况下,用高度代替宽度可能会起作用.

我也尝试过像你一样使用遏制,并发现它有时会使事情变得更加困难,具体取决于行中的项目.就像你已经解释的那样,包括容忍：“指针”有助于缓解问题,但如果可能的话,删除包含通常会使UI更加宽容.