Как вживую определять высоту элементов при изменении размера окна?

У меня есть фиксированная верхняя панель на моем сайте, и я добавляю padding-top к элементу body в зависимости от высоты верхней панели.

$('body').css('padding-top', $('.topbar').height());

Но когда я изменяю размер окна и верхняя панель становится выше, приведенный выше код jQuery не работает, пока я не обновлю страницу в желаемом окне просмотра.

Как определить высоту верхней панели в реальном времени, даже если размер окна изменен?

Любая помощь очень ценится!


person Rafff    schedule 27.12.2013    source источник
comment
Другой способ добиться того же - обновить страницу при изменении размера окна: $ (window) .resize (function () {location.reload ();});   -  person Gerard de Visser    schedule 27.12.2013
comment
Мне нужно что-то без обновления страницы, но спасибо за ваши усилия   -  person Rafff    schedule 27.12.2013


Ответы (2)


jQuery имеет .resize() событие. Итак, вы можете попробовать:

 $( window ).resize(function() {  

 $('body').css('padding-top', $('.topbar').height());

 });

Если это не сработает, сделайте скрипку, и мы сможем посмотреть, как работает ваша страница.

person kmoe    schedule 27.12.2013

Вам нужно прослушать событие изменения размера:

$(window ).resize(function() {
    $('body').css('padding-top', $('.topbar').height());
});
person kasper Taeymans    schedule 27.12.2013