Страницы

Поиск по вопросам

понедельник, 17 июня 2019 г.

Как сделать такой вывод изображений?

Здравствуйте. Есть несколько изображений, все примерно одинакового размера. Я хочу вывести эти изображения на странице в таком стиле.
Думал просто сделать
imga img { width: 50%; }
Но тогда они получаются все одинакового размера. Наверное тут не обойтись одним css. Буду благодарен за полезную информацию.


Ответ

Конечно же одним imga img { width: 50%;} не обойтись. Тут нужен и css и js
Я предлагаю вам взглянуть на Freewall
Это кроссбраузерный responsive Jquery плагин, который поможет вам создать много различного типа макетов сеток: гибкий макет, макет для фото, вложенные макеты, metro стиль, как у pinterest и прочие виды. Там используется CSS3 анимация. Данный плагин - хорошее решение для динамического создания макета сетки как для десктопа, так и для мобильных версий и версий типа tablet.
домашняя страница плагина

Если он не устроит, то в поиске по запросу javascript photo brick вы сможете, я думаю, найти что-то еще подходящее для вас, например
http://masonry.desandro.com/
http://callmecavs.com/bricks.js/
и многое другое.

Комментариев нет:

Отправить комментарий