JQuery Isotope: Как заполнить пустые пробелы?

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

Вы видите эти пробелы? Есть ли какой-либо код jquery, чтобы нижние элементы заполняли эти пробелы всякий раз, когда они есть?

ЕСЛИ мы используем единую ширину для всех элементов, проблема вообще не отображается. Он начинает отображаться при использовании разных ширины для каждого элемента. Изотоп недостаточно интеллектуальный, чтобы искать пустые пробелы и заполнять их, если имеется подходящий размер.

Дополнительный вопрос, который может помочь решить эту проблему:

Есть ли какой-либо плагин jQuery, который заставляет элементы плавать? Я считаю, что это может заставить подгоняемые предметы заполнить пустые места!

Ответы

Ответ 1

В последнем редакторе теперь существует режим макета пакета для изотопа. Исходный ответ и последующие дополнения остаются ниже.

Эта функция также была запрошена другими пользователями:

Короче говоря, текущий ответ кажется, что если вы хотите избежать пробелов в целом, вы должны:

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

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

Если ручная настройка элементов для заполнения пробелов для контейнера с фиксированной шириной не будет работать для вас, я бы рекомендовал использовать chiming с +1 по первой ссылке.

E (4.22.2013): Я заметил недавнюю активность, поэтому быстрое обновление. Это все доступно в каменной кладке № 141, первая ссылка:

PerfectMasonry - это расширение макета для изотопа. Он заполняет пробелы, предоставляя макет "perfectMasonry" layoutMode и параметры, которые обеспечивают разметку.

Nested - альтернативная библиотека для разметки макетов.

Packery - это библиотека создателя Isotope, которая поддерживает разметки и многое другое.

Я лично не использовал ни одного из них (пока).

В конце концов, на в своем блоге о выпуске Packery, DeSandro заявляет: "В конце концов, Id нравится переносить этот и другие разработанные решения в упаковке для масонства и изотопа".

Я не буду рассчитывать на то, что это произойдет невероятно скоро. Packery выпускается только 7 дней с момента редактирования.

E2 (6.13.2014):

DeSandro выпустила режим макета пакета для изотопа.

Ответ 2

Я попытался объяснить, почему это в этом повторяющемся потоке, который включает в себя скрипку для игры. Это не обязательно фиксированная ширина, если у вас есть много мелких предметов, как в оригинальной демонстрации, вероятность того, что плотная подгонка высока, но не гарантирована. Вы можете использовать альтернативный плагин, такой как jQuery Tiles, или попытаться адаптировать Wookmarks.

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