Min-width и max-width в IE6 с помощью expression
Уже писали много раз, просто приведу свой код.
В JavaScript-файле размещаем такую функцию:
function width(min,max){
w = document.documentElement.clientWidth;
return (w <= min) ? min + "px" : ((w >= max) ? max + "px" : "auto");
}
Функция всего лишь принимает значения максимальной и минимальной ширины, проверяет текущую ширину документа и возвращает значение:
- Если ширина документа меньше минимальной ширины, то возвращается минимальная ширина;
- Если ширина документа больше максимальной ширины, то возвращается максимальная ширина;
- Иначе ширина указывается автоматическая.
Функция из CSS вызывается следующим образом:
div {
width: expression(width(600,1000));
/* далее для нормальных браузеров */
min-width: 600px;
max-width: 1000px;
}
600 и 1000 — минимальная и максимальная ширина. Поскольку expression работает только для IE, а min-width и max-width уже работают в IE7 и IE8, то этот CSS нужно изолировать и вынести в отдельный css-файл и подключить его с помощью условных комментариев, либо воспользоваться хакками, поскольку чтобы изменить значение придётся лезть в два файла, а не в один. Ну это уже как кому удобнее.
Скачайте пример и убедитесь, что всё работает.
Минимальную ширину в IE 6 можно эмулировать с помощью приёма, в котором указывается правый border для контейнера шириной в необходимую минимальную ширину элемента, а элементу задаётся правый отрицательный margin равный той же минимальной ширине. При этом внутренний элемент должен быть либо плавающим (float), либо inline-block. В общем не читайте и не внимайте в эти последние предложения, а просто посмотрите пример на cssplay.co.uk.





]]>nemec]]>я надеюсь Вы не забыли, что expression вызывается при каждом действии (например при перемещении курсора). Получается довольно накладно с JavaScript, если нам только нужно менять min-width и max-width при загрузке и при ресайзе бровсера.
»При большем количестве подобных хаков (На полностью все события) сайт быдет саметно тормозить
]]>Никита]]>nemec, не проблема добавить в функцию флаг выключающий её. Есть другие предложения?
»]]>Олег]]>На http://www.cssplay.co.uk есть пример без использования
»JavaScript,
http://www.cssplay.co.uk/layou.....ual-height
]]>Никита]]>Олег, посмотрите в код страницы, на которую вы дали ссылку.
»]]>vill]]>в принципе знакомая тема..не раз уже встречал на форумах.. а вот добавление в функцию флага, выключающего ее, действительно улучшает ситуацию
»]]>Татьяна]]>Спасибо.
»]]>Макс]]>Спасибо. Ура!
»