Почему при фиксированном навигационном скачке?

Мой сайт http://southsideonline.com/

У меня просто есть простой sticky.js, который фиксирует навигационную панель на прокрутке, но содержимое под навигацией подпрыгивает под панелью навигации. Любая идея, как это исправить?

jQuery(function(){
  var menuOffset = jQuery('.menu-wrapper')[0].offsetTop;
  jQuery(document).bind('ready scroll',function() {
    var docScroll = jQuery(document).scrollTop();
    if(docScroll >= menuOffset) {
      jQuery('.menu-wrapper').addClass('fixed');
    } else {
      jQuery('.menu-wrapper').removeClass('fixed').removeAttr("width");
    }
   });
});

кажется, что это, по-видимому, легкое решение. Я попытался использовать jQuery .next (), чтобы поместить верхний край следующего .css после nav, чтобы он подходил под навигацию, как должен. любые другие яркие идеи?

javascript,jquery,navigation,sticky,

1

Ответов: 4

<< div class = "menu-wrapper" id = "menu-wrapper"> class = 'answer' id = '4263417' itemscope itemtype = 'http: //schema.org/Answer'>
2 принят

Оберните ваш divдругой div(placeholder) и установите heightзначение 84px по CSS (равно фиксированной высоте меню) или с помощью JS. Вы столкнулись с этой проблемой, поскольку фиксированные элементы исключены из расчета позиции.

1

После того, как ваша навигация станет липкой / фиксированной, остальная часть макета перемещается вверх по странице, чтобы заполнить пространство, которое было навигация, когда оно было относительно позиционировано (или с потоком изначально).

1

Добавьте статическую высоту в свой заголовок, поэтому она не сжимается, когда панель навигации выходит из потока, примерно так:

header { height: 117px; }

Это сработало для меня.

0

У меня была проблема с выравниванием контейнера (300px центр с границей), который должен был быть исправлен. После того, как контент достиг контейнера, он слегка подпрыгнул (около 2-5 пикселей вправо). Мне удалось отрегулировать его, положив 0 полей и отступов на тело в css).

JavaScript, JQuery, навигация, липкий,
Похожие вопросы
Яндекс.Метрика