Проблема с сортировкой засечек jquery

Ответ 1

Я обычно решаю это, связывая обратный вызов, который устанавливает высоту заполнителя на высоту элемента, отсортированного по событию start. Это простое решение, которое дает вам тонкий контроль над тем, как вы хотите, чтобы ваш заполнитель отображался.

$( ".column" ).sortable({
    connectWith: ".column",
    start: function(e, ui){
        ui.placeholder.height(ui.item.height());
    }
});

См. обновленный тестовый пример

Ответ 2

Вы пытались установить свойство forcePlaceholderSize:true? Прочитайте страницу jQuery UI Sortable .

Ответ 3

Являются ли ваши элементы display: block? Встроенные элементы могут привести к тому, что заполнитель не сохранит высоту правильно. Например. этот jsFiddle, похоже, похож на проблему, описанную вами. Добавление display: block в класс .portlet исправляет его.

Ответ 4

Вместо использования "ui.item.height()" вы можете использовать "ui.helper [0].scrollHeight" для стабильного результата при перетаскивании элемента из внешнего контейнера.

$( ".column" ).sortable({
    connectWith: ".column",
    start: function(e, ui){
        ui.placeholder.height(ui.helper[0].scrollHeight);
    }
});

Ответ 5

Вы можете установить стиль для своего заполнителя в качестве опции для сортировки.

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

И просто придайте этому стилю высоту. Надеюсь, что это работает.

Ответ 6

В моем случае я нашел решение, подобное JP Hellemons, в котором я заставляю высоту заполнителя (с важностью) настраивать, а также настраивать видимость с фоном видеть изменения для себя (также вы можете так стилизовать свой заполнитель, как хотите).

Это также работает с display: inline-block;

.ui-sortable-placeholder { 
     background:red !important; 
     height: 2px !important; // this is the key, set your own height, start with small
     visibility: visible !important;
     margin: 0 0 -10px 0; // additionaly, you can position your placeholder, 
     }                    // in my case it was bottom -10px