Как сделать, что бы хедер при скролле не наезжал на контент?

Question

[HelenaS]

Здравствуйте!

Суть проблемы - есть "липкий" хедер. При переключении на ссылки, он наезжает на область контента и перекрывает её на свою высоту.

$(window).scroll(function() {
                var top = $(document).scrollTop();
                if (top < 650) $(".header-content").css({top: '0', position: 'relative'});
                else $(".header-content").css({top: '0px', position: 'fixed'});
            });

Скрипт вот такой.
Вопрос - как мне сделать, что бы хедер при скроле появлялся перед контентом, а не в контенте?
Заранее спасибо за помощь.

Comments

[Сергей Горячев]

Ничего не понятно, но столько букв не могут быть неубедительным аргументом. Пример бага нужен тут. Более конкретный пример)

Answer 1

[iBird Rose]

когда задаешь fixed для хедера - у ниже стоящего блока делай padding-top на высоту твоего хедера.
типа так:

$(window).scroll(function() {
                var top = $(document).scrollTop();
                if (top < 650) {
                     $(".header-content").css({top: '0', position: 'relative'});
                     $(".under-header").css('padding-top', 0);
                }  else {
                    $(".header-content").css({top: '0px', position: 'fixed'});
                    $(".under-header").css('padding-top', headerHeight);
                }
            });

Comments

[HelenaS]

К сожалению, не работает.

[iBird Rose]

HelenaS: что именно?