Альтернатива Гридстеру?

Я использовал библиотеку Gridster для проекта, который использует сетку с несколькими столбцами перетаскивания. К сожалению, Gridster поддерживает только Internet Explorer 9+. Мне нужно найти аналогичную простую в использовании библиотеку, которая позволяет мне делать то же самое с использованием IE8, и, если это возможно, также совместимо с IE7 и IE6.

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

P.S. Я нашел один из AnimaDrag, но это не так хорошо, как Gridster, и это плохо.

Ответы

Ответ 1

Есть также Shapeshift: https://github.com/McPants/jquery.shapeshift

и Gridly: http://ksylvest.github.io/jquery-gridly/

которые являются хорошими альтернативами Gridster. (все же обратите внимание, что Gridly только для квадратов)

Изменить: Packery также очень интересен: http://packery.metafizzy.co/ , Однако для этого требуется коммерческая лицензия для коммерческого проекта:

Для некоммерческих, личных или открытых проектов и приложений, вы можете использовать Packery в соответствии с условиями GPL v3 Лицензия.

Редактировать 2: Это также может быть полезно: https://github.com/uberVU/grid

Ответ 2

Вы можете попробовать Gridstack: https://github.com/troolee/gridstack.js Это ранняя версия, но основанная исключительно на сетчатке, и она также отзывчива.

Ответ 3

[N.B. Я опубликовал этот ответ на странице github для проекта по аналогичному вопросу, который кто-то поднял. Поэтому проверьте там, если этот ответ был исправлен! - https://github.com/ducksboard/gridster.js/issues/74]

Я провел последние несколько дней с подобной проблемой - хотя мне нужна была только поддержка IE8 (хотя, похоже, она работает в IE7). Проблема заключалась в том, что код обновляет страницу правильно, но IE не собирал/не оценивал изменения строки данных и данных в ходе перемещения мыши. Я попробовал несколько вещей из вышеприведенного решения, используя библиотеки modernizr и аналогичные библиотеки и, наконец, попытался привязать к IE только событие "changechange" без успеха.

Кажется, это ограничение IE8, что он не будет переоценивать элемент, который использует атрибуты CSS, пока мышь не работает/перемещается. Тем не менее, он обнаруживает изменения класса и строки (поэтому вы можете перетаскивать поле).

Поэтому единственным доступным решением было время добавления/удаления поддельного класса в коде всякий раз, когда виджеты должны обновляться с помощью jQuery.toggle(). Поэтому я добавил его в код, когда превью и виджетам были переданы новые атрибуты data-col и data-row. Это заставляет IE8 забирать изменения и просматривать видео в режиме voila.

Теперь я уверен, что есть (намного) лучшее решение, помимо использования IE8, и это не гарантирует совместимость IE8, но если вы застряли, вы можете найти это полезным!

p.s. Мне только пришлось беспокоиться о IE8 +, IE7, казалось, был в порядке при использовании modernizr и подобных плагинов. Однако не пробовал в IE6, но я сомневаюсь, что это сработает.

[EDIT]

Следуя приведенному ниже комментарию, я теперь загрузил пример - хотя я не мог заставить IE8 играть хорошо с JSFiddle. Итак, пример этого, работающий в IE8, здесь:

https://s3-eu-west-1.amazonaws.com/707074webfiles/gridster/ie8test.html

Я включил IE9.js, который (в основном) добавляет эффект прозрачности для предварительного просмотра в этом экземпляре.

Измененная копия файла gridster.js находится здесь:

https://github.com/Grozzer/gridster.js/blob/master/dist/jquery.gridster.js

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

Во время записи изменения строки для ie8:

  • 717: Добавлена ​​опция совместимости с IE8
  • 2054 - 2056: Добавлена ​​опция .toggle в виджет предварительного просмотра
  • 2433 - 2435: Добавлена ​​опция .toggle для всех перемещенных виджета.
  • 2488 - 2490: Добавлена ​​опция .toggle для всех перемещенных вниз виджета.

Ответ 4

Правильно, сетчатка поддерживает Internet Explorer 9+, Firefox, Chrome, Safari и Opera. Если вы хотите поддерживать старые браузеры IE (6+), почему бы не создавать функциональные возможности вокруг jQuery draggable и jQuery droppable

Ответ 5

Вы пытались использовать polyfill для имитации функций набора данных из сетки? http://www.orangesoda.net/jquery.dataset.html может быть хорошей альтернативой.