Как растягивать div по всей высоте окна браузера

24 Январь 2012 4 comments
С помощью css растянуть слой у меня не получилось. На помощь пришел javascript и JQuery. при изменении размеров будем менять размер слоя принудительно: Вот так все просто. Вообще для window и document доступна только эта функция. Зато для остальных элементов есть еще несколько: подробнее здесь.
Categories: HTML CSS JS Tags: , , ,

Как менять и узнавать высоту элементов html страницы на JQuery

24 Январь 2012 Нет комментариев
width и height бывают разные. А потому и несколько функций на JQuery.

.height()

.height() - возвращает высоту элемента (его информационную часть) .height(value) - устанавливает высоту элемента

.innerHeight()

.innerHeight() - возвращает высоту элемента с учетом padding (далее...)
Categories: HTML CSS JS Tags: , , ,

Резиновый шаблон на div (слоях) и css

23 Январь 2012 Нет комментариев
Много решений в инете, о конструировании на слоях шаблонов страниц, но под мою задачу не было. Вот решил поделиться. ТЗ:
  • Три колонки (ничего нового, в принципе - не важно сколько их)
  • Все растягивается по ширине, пропорционально: левая - 20%; правая - 20%; центральная - 60% (ничего нового)
  • Слои не должны переноситься при ресайзе окна (тоже логично, но немного конфликтует со следующим пунктом)
  • При ресайзе слои должны ужиматься до минимально размера в 300px - левая и правая колонки, 400px - центральная
А проблема в том, что 300px получается больше 20% при общей ширине в 1000px, и слои переносятся если места не хватает. Итак, решение:
  • Ограничиваем слои в сжатии
  • Задаем параметры ширины в соответствии с ТЗ
  • Боковые слои выравниваем налево и направо. И обтекаем их центральным
Вот как-то так. Смотрим на практике: (далее...)