Как расположить изображения плиткой, как во Вконтакте?



@SanistRay

Здраствуйте. Зразу к сути поставленной задачи, нужно сделать отображение картинок в блоке как во Вконтакте. Т.е Изображения разной ширины и высоты подстраиваются, и все это выглядит красиво.

Пример, как во Вконтакте когда 3 изображения:

6013fbf9e9359045375131.jpeg

Максимум может быть 10 изображений. Если изображений много, то будет что – то типо этого:

6013fd67cde90824892321.jpeg

Сайт на WordPress, поэтому если есть плагины с похожим функционалом было бы хорошо. Но если нет, решения на CSS / JS / jQuery вполне устроят.

Данный вопрос я гуглил, были варианты для полноценных галерей, но под конкретно мой случай они не подходят потому что при большом количестве изображений блок просто увеличивает высоту и изображение выстраиваются в мозаику, а нужно что – бы сильно уменьшались (как на последнем скрине выше).

Заранее спасибо всем за ответы.


Решения вопроса 1



@OtshelnikFm

Примерно похожее делал – компоновал галерею маркируя дополнительным классом горизонтальное и вертикальное изображение (на php получить размеры из метаданных пикчи проблем нет). Css классом писал кол-во в wrapper изображений. Потом была магия css
Получилось примерно так: https://yadi.sk/i/0_2_7kD2ZGU04A
классы хитрые https://yadi.sk/i/QoiKqQsbz0S7zg но там 50 строк css для вариаций и их отображений.
С js заморачиваться не хотел – решил в лоб

p.s. ссылку дать не могу – тостер не пропускает урл (наверно потому что основной домен указан у меня в профиле – по нему тостер саморекламой считает)



5

комментариев


Ответы на вопрос 0

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *