Здравствуйте. Есть несколько изображений, все примерно одинакового размера.
Я хочу вывести эти изображения на странице в таком стиле.
Думал просто сделать
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/
и многое другое.
Комментариев нет:
Отправить комментарий