Это может быть трудно объяснить. Есть ли подобный плагин, например, каменная кладка jQuery, способная обнаруживать пробелы в предопределенной сетке и перемещать и позиционировать элементы, которые будут вписываться в эти пробелы?
Поскольку все другие способы объяснения моего вопроса были бы сложными, я нарисовал простой образ, чтобы показать, что я имею в виду.
Примечание: это гибкий веб-дизайн с жидкостью.
Итак, мой dom-порядок равен 1,2,3. Однако, когда вы меняете мой макет в пределах определенного media-query, я хочу динамически переключать порядок dom или позиционировать элементы по-разному. Точно так же, как вы видите в моем примере.
Я знаю, что есть такие вещи, как jQuery Masonry или jQuery Isotope но оба этих плагина не заполняют все пустые пространства сетки. Например. проверьте этот снимок изотопа...
Отсутствует один элемент. Конечно, в большинстве случаев это то, что вы хотите сохранить порядок элементов. В моем случае я не забочусь о заказе, я просто хочу, чтобы все пробелы и пробелы были заполнены. Так, как вы видите мой эскиз выше, item-nr-3 следует перемещать вверх, чтобы соответствовать пустому промежутку (так как он вписывался в него). И если бы был другой item того же размера, который бы соответствовал пробелу под item-nr-3.
Как это возможно? Есть ли какой-то плагин jQuery? Или у вас есть другие idaes?
Дополнительная информация:
items и ящики, о которых я говорю, имеют значение box-sizing:border-box, поэтому мне не нужно беспокоиться о paddings или полях.
Update: Вот живой пример проблемы: http://jsfiddle.net/r79u2/1/
