Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Изменение ширины div-ов (https://javascript.ru/forum/jquery/9298-izmenenie-shiriny-div-ov.html)

greg 09.05.2010 14:19

Изменение ширины div-ов
 
на странице 4 колонки (резиновые, 25% каждая по ширине). от краев страницы до колонок и между ними нужны фиксированные промежутки в 10px. средствами html\css не смог придумать, как уместить на странице все 4 колонки, кроме уменьшения размера каждой до 24%. иначе 4-ая колонка размещается под 3-ей.

решил узнать ширину document, вычесть сумму промежутков и поделить на 4 (в ие результат получался больше, пришлось уменьшать на 6:

$(document).ready(function(){
var x=0
if ($.browser.msie) {
x=x+6;
 }
$('div#content').css('width', ($(document).width()-50)/4-x); 
});


все работает как надо, если не изменять размер окна. при уменьшении ширины окна браузера, последняя колонка(и) съезжают под предыдущую. а если потом развернуть окно на максимум, то колонки остаются узкими. если обновить страницу, то колонки отображаются как надо по ширине.

вопрос: можно как-то "отловить" изменение размеров окна браузера и обновлять ширину колонок без обновления страницы пользователем?

exec 09.05.2010 14:45

$(window).resize(function () {
// function
});

greg 09.05.2010 17:21

пробовал вставлять в resize например изменение фона элемента - меняется, а вот чтобы отразились изменение ширины колонок, надо их load'ом перезагружать? другого варианта нет?

greg 09.05.2010 22:52

так работает, спасибо.

$(document).ready(function(){
var x=0;
        if ($.browser.msie) {
            x=x+6;
        }
        $('div#content').css('width', ($(document).width()-50)/4-x);
});
$(window).resize(function() {
        var x=0;
        if ($.browser.msie) {
            x=x+6;
        }
        $('div#content').css('width', ($(document).width()-50)/4-x);
});


повторяющийся код в одну функцию занесу.


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