JQuery UI sortable - невозможно перетащить элементы в нижнюю часть подключенного списка/столбца

У меня проблема с сортировками jQuery. Я использую его для создания панели управления iGoogle, создавая 3 столбца. Все 3 содержат сортируемые div и связаны друг с другом с помощью опции connectWith.

Проблема, с которой я столкнулась, заключается в попытке сбросить div в нижней части сортируемого столбца; это просто не хочет. Он работает только в том случае, если я перетаскиваю его над/мимо самого нижнего div, который уже находится в списке, к которому я перетаскиваю.

Есть ли способ избежать этого? Или, возможно, создать фиктивный div, установленный в нижней части каждого столбца? ЛЮБОЙ помощи в этом было бы очень полезно!

Спасибо заранее.

Ответ 1

Старый вопрос, но, возможно, помощь другим...

Заполнение работает, но меняет ваше визуальное лечение.

Другим решением является использование "допуска", предоставляемого сортируемым api. Значение допуска "указатель" означает, что до тех пор, пока пользовательский курсор находится над одним из других элементов, элемент может заменить его позицию (вместо того, чтобы быть определенным количеством пространства над элементом, который является причиной, по которой у вас возникают проблемы без заполнения).

Попробуйте добавить это к вашей инициализации (в моем примере я сортирую список по вертикали).

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

Это должно быть очень быстро после того, как вы это сделаете.

Также вы можете увидеть jquery doc на нем здесь: http://api.jqueryui.com/sortable/#option-tolerance

Ответ 2

В столбцах, содержащих div, требуется достаточно большое дополнение к нижней части, чтобы расширить область перетаскивания за нижний div. В противном случае столбцы крепко обнимают divs, а область под каждым нижним div лежит вне сортируемого списка.