jQuery плагин для Постройки мозаики из блоков

[Isis]

masonry.desandro.com

[neyrowebster]

Да, я его видел. Не знаю причин, но строило через раз.

[novoxudonoser]

Вы просто не смогли его приготовить. Работает он через раз из за асинхронной загрузки изображений. Надо использовать imagesLoaded пример — http://codepen.io/desandro/pen/RPKgEN

[neyrowebster]

благодарю

[hell0w0rd]

Шел 2016, люди все еще пишут jquery плагины. Судя по коду — совершенно спокойно можно сделать с помощью современного JS.

[neyrowebster]

для практики пойдёт.
Честно, понимаю что нужно уходить от jQuery.
Стараюсь.)
Писал чтобы получить приглашение на хабр.

[Rastishka]

Мне кажется что такое уже давно должно делаться на чистом CSS, флексбоксами какими нибудь…
Или пока еще невозможно?

[Akuma]

Можно вот так делать: http://w3bits.com/css-masonry/
Но это немного не то, т.к. нет разнородных элементов. А в точности повторить масонри на чистом CSS пока, думаю, не получится.

[k12th]

var cols = new Array() // Массив для высоты колонки

Есть только один повод писать new Array в JS — это если нужен массив undefined заданной длины. В принципе, вреда в этом нет, если человек понимает, что делает, но во многих code style порицается.

for(i = 0; i < set.n; i++)
	cols[i] = 0;

А вот за это в приличных проектах канделябром-с:)

Вообще этот кусок можно переписать (субъективно) красивее:

var cols = (new Array(set.n)).map(_ => 0)

Как минимум, короче.

Плагины к jQuery не нужны — раньше они позволяли несколько уменьшить риск коллизий имен, сейчас этим занимается модульная система. Переделайте на обычную функцию, которая принимает элемент, и положите в пакет с зависимостью от jQuery.

[neyrowebster]

Спасибо!
Хорошее замечание.

[neyrowebster]

не знаю точно что, но что-то тут не так. Попробовал, не работает(

var cols = (new Array(set.n)).map(_ => 0);

покручу ещё.

[k12th]

Это ES6, если что. Оно может где-то не работать без компиляции. В ES5 это будет так:

var cols = new Array(set.n).map(function (_) {
  return 0;
});

[neyrowebster]

спасибо.
Понял.
Пошёл познавать истину.

[irezvov]

это и не должно работать. map и forEach не работает на массивах, только что созданных через new Array(length). Вас ввели в заблуждение

[k12th]

Ваша правда, а мне пора на свалку:(

[hell0w0rd]

Тогда уж:

let cols = new Array(set.n).fill(0);

[POPSuL]

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

Это не реклама

http://rinamika.ru/
раньше работал в этой компании, и пилил эту мозайку
Решил задачу таким вот говнокодом http://rinamika.ru/resources/javascript/mosaic.js.
И не просите это прокомментировать!

[Matysh]

Вдруг кому пригодится.
github.com/tin-cat/jquery-mosaic