Question

我有一个可拖动的元素列表。我唯一使用的jQuery是：

$('.section_rows').sortable();

这很好用。但是，当我在页面底部（垂直滚动到底部），然后单击一行进行拖动和排序时，页面会“跳起”55px。虽然这在功能上并不是一个大问题，但它是一种糟糕的用户体验（并且可拖动的行位于此页面的底部，因此这种打嗝总是会发生）。

我看了一下HTML，看起来jQuery正在添加一个名为'.ui-sortable-helper'的类，其中包含一个高度为55px的样式。

有没有办法可以在选择可拖动项目时禁用此功能或强制页面“不移动”？

Answer 1

听起来你需要一个drop占位符来保持列表的高度相同。尝试：

$(".section_rows").sortable(P{
   placeholder: 'ui-state-highlight'
});

确保.ui-state-highlight的CSS设置为适当的高度。

Answer 2

手动将占位符添加到sortable函数（http://jqueryui.com/sortable/#placeholder），并设置样式：

$('.section_rows').sortable({placeholder: "ui-state-highlight"});

.ui-state-highlight {
    height: 55px;
    line-height: 1.2em;
    background: rgb(250, 252, 255)!important;
    border: none!important;
}

.sortable（）添加50px高度，显示滚动条

2 个答案: