Включение перетаскивания с помощью Gridster.js

Question

Я пытаюсь пользователю Gridster.js иметь редактируемую сетку перетаскивания (as per the example here on their home page).

У меня есть действительно простой пример, чтобы заставить его работать - все это выглядит великолепно, и я могу выбирать элементы для перемещения, но все всегда просто возвращается в исходное положение, и ни одна из других фигур не смещается ad Я перетаскиваю элемент (если вы видите их пример, когда вы перетаскиваете один элемент, другие перемещаются в реальном времени).

Мой HTML является по их рекомендации:

<div class="gridster ready"> 
    <ul style="position: relative; height: 360px;"> 
     <li data-row="1" data-col="1" data-sizex="2" data-sizey="2" class="gs_w widget-orange">loading</li> 
     <li data-row="1" data-col="3" data-sizex="1" data-sizey="1" class="gs_w widget-orange">loading</li> 
     <li data-row="2" data-col="3" data-sizex="1" data-sizey="1" class="gs_w widget-orange">loading</li> 
     <li data-row="1" data-col="4" data-sizex="1" data-sizey="1" class="gs_w widget-orange">loading</li> 
     <li data-row="2" data-col="4" data-sizex="1" data-sizey="1" class="gs_w widget-orange">loading</li> 
    </ul> 
</div> 

И мой JS как за у них на домашней странице:

var gridster; 
    $(function(){ 

    gridster = $(".gridster > ul").gridster({ 
     widget_margins: [20, 20], 
     widget_base_dimensions: [140, 140], 
     min_cols: 6 
    }).data('gridster'); 

    }); 

Кто-нибудь есть какие-нибудь идеи? Кто-нибудь использовал эту библиотеку? (У меня нет ошибок, зарегистрированных в инструментах разработчика в консоли хром и т. Д.)

Answer 1

Чтобы сделать его работу, вам необходимо удалить класс ready из неупорядоченного списка. Gridster добавляет его автоматически, когда он правильно загружает плагин, потому что он уже существует, он не загружается должным образом.