Форум Сайтостроение Веб-строительство

количество элементов в зависимости от ширины окна браузера

12 3
R
На сайте с 22.12.2009
Offline
94
runseoman
1459

количество элементов в зависимости от ширины окна браузера

как на http://med-info.ru/

когда ресайзишь окно в разделе Новости есть элементы количество которых зависит от ширины <div id="news"...>

Chained
На сайте с 10.01.2013
Offline
92
Chained
#1

Вопрос где?

R
На сайте с 22.12.2009
Offline
94
runseoman
#2

вопрос: как это сделать, куда копать?

Desesperada
На сайте с 11.10.2010
Offline
77
Desesperada
#3

блокам выравнивание в строку

родительскому диву overflow

курим и радуемся

Создание/наполнение сайтов ICQ 7860919 Принимаю предзаказы на сателлиты/гс в индексе
vlad00777
На сайте с 24.12.2009
Offline
119
vlad00777
#4

Desesperada, а отступы кто делать между блоками меньше будет?

ТС - jQuery.

Верстка. Качественно! Адаптивная, резиновая, с параллаксом и прочими плюшками. В ЛС.
Desesperada
На сайте с 11.10.2010
Offline
77
Desesperada
#5
vlad00777:
Desesperada, а отступы кто делать между блоками меньше будет?

я в целом описал вариант, само собой скриптом более функционально выйдет

C
На сайте с 04.02.2005
Offline
291
Chukcha
#6

http://css-live.ru/articles-css/ravnomernoe-vyravnivanie-blokov-po-shirine.html

R
На сайте с 22.12.2009
Offline
94
runseoman
#7
Desesperada:
я в целом описал вариант, само собой скриптом более функционально выйдет

Вы показали пример с 5 блоками (и их постоянно 5)

http://css-live.ru/Primer/viravnivanie-items/pseudo-element.html

а меня интересует вариант когда N блоков

и при изменении, например увеличении ширины, кол-во блоков становиться больше

а при уменьшении ширины блоки пропадают

PS: или может я не туда смотрел?

Помогите с блоками div Как увеличить CTR проекта Google AdSense - Вопросы
DiAksID
На сайте с 02.08.2008
Offline
236
DiAksID
#8
runseoman:
.. а меня интересует вариант когда N блоков ...

- все блоки плавающие

- размер, марджины и паддинги в % от ширины контейнера. возможные варианты задать @media

- box-sizing: border-box

получится хоть и не "адаптив", но вполне себе "респонсив"

ну а захочется настоящей адаптивности - добавить подгонку процентов скриптом при onload и resize (@media лучше оставить для лишенцев)...

show must go on !!!...
CSS: прилепить блок к Подскажите по верстке. Три Как сделать контейнер адаптивным?
R
На сайте с 22.12.2009
Offline
94
runseoman
#9

думаю попробовать с $( window ).resize(function()

отслеживать ширину DIVa и делать блоки в display:none при уменьшении DIV и наоборот

R
На сайте с 22.12.2009
Offline
94
runseoman
#10

есть решение

проверил - работает

вот может кому надо будет

<script type="text/javascript">
$(window).resize(function() {
x = document.getElementById('moyblock').clientWidth; moyblock - DIV в котором выводятся элементы
y = ; - ширина одного элемента
n = Math.floor(x/y);
k = Math.floor(z/(n));
for (i = 1; i <= k*n; i++){document.getElementById('bl'+i).style.display = 'inline-table';} - элементы имеют id bl1,bl2...
for (i = k*n+1; i <= z; i++){document.getElementById('bl'+i).style.display = 'none';}}); z - всего элементов
</script>
12 3

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий