Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Заполняющийся контент резинового сайта (https://javascript.ru/forum/dom-window/25670-zapolnyayushhijjsya-kontent-rezinovogo-sajjta.html)

DATU 12.02.2012 14:12

Заполняющийся контент резинового сайта
 
:write: Добрый день (утро, вечер или ночь). Приятного настроения всем.:yes:

Вот решил перейти на резиновые сайты, даже не ожидал что с ними стока гемороя. В принципе всё в них понятно, за исключением одной вещи.
На примере сайта ozon.ru
Там несколько div-строк с товарами. Они заполняют всю ширину резиновой части, бех переноса на другую строку. количество товаров в строке зависит от ширины экрана (монитора). К примеру у меня 5. Если начну скролить с зажатым "контролом", то количество товаров в строке увеличивается или уменьшается в зависимости от размера.
Как это реализовать? :help:
Пытался искать в поисковиках информацию, но не знаю как грамотно задать поиск по этой теме. Подскажите с чего начать, что почитать.

СПАСИБО большое за внимание! :thanks:

poorking 12.02.2012 14:17

http://chikuyonok.ru/2011/04/inline-vertical-align/

DATU 12.02.2012 14:39

Спасибо большое, poorking, за ссылку. Интересная статья, возьму на вооружение.:yes:
НО К СОЖАЛЕНИЮ :cray: я не нашёл в ней ни решения, ни ответа на вопрос "как делать?" и "где искать?"
--------------------------------------
Интересный код нашёл на том же ozon.ru

<script type="text/javascript">var params={minValue:2,maxWidth:165};var func=function(){blockResize(params);makeVisible();};$(window).ready(func);$(window).resize(func);</script>


уверен, что он связан с решением, но как найти остальную часть среди прочего кода?:blink:

poorking 13.02.2012 10:36

Цитата:

Сообщение от DATU
Там несколько div-строк с товарами

По ссылке что я дал 1к1. И подробно расписано как реализовать.

DATU 13.02.2012 12:25

poorking,
Друг, спасибо болшьшое, за статью. Она реально полезная. Я её подробно изучил. :yes:
НО зайди на сайт OZON.RU обрати внимание на количество товаров в строках, затем зажми "Ctrl" и покрути колесиком мыши. Количество товаров в строке изменяеться в зависимости от размера окна. Это и есть настоящий резиновый сайт с отличным скриптом для него. И какая тут связь со статьёй "Список блоков с разным вертикальным выравниванием", ссылку на каторую ты мне дал?:cray:

Aetae 13.02.2012 13:00

Ну это банальный float:left, или display:inline-block.

DATU 14.02.2012 02:35

Aetae, нет :-? я уверен, что там javascript участвует.

Seva1986 14.02.2012 16:48

Цитата:

Сообщение от DATU
я уверен, что там javascript участвует.

ну да участвует, он проверяте ширину и если влезит нужное количество, то добавляет класс нужный, в зависимости от класса у блоков ставиться display:none или block;

вообще такое на сss3 можно сделать для нормальных браузеров...

DATU 15.02.2012 12:17

Спасибо, Seva1986, всё понятно обяснил.:yes: Подскажи пожалуста, как реализовать "прослушиватель" размера окна? :-? То есть: если окно меняет размер (например была нажата кнопка "свернуть в окно" или был изменён с помощью контрола), то заного просчитать ширину.

Seva1986 15.02.2012 12:34

на скрипте window.onresize
на сss директива media с параметром max-width или min-width


Часовой пояс GMT +3, время: 10:24.