1

Решил сделать прилипающий header при скроле, при этом столкнулся с неприятным багом. Когда происходит скрол header начинает мигать.

Подскажите в чем проблема,и как это можно решить?

Пример на CodePen

1 ответ 1

2

Замените

var navPos = jQuery('nav').offset().top;

На

var navPos = jQuery('nav').position().top;

codepen

3
  • Спасибо работает! Но обясните что не так с методом offset, почему с помощью него функция работала не корректно?
    – JavAs
    7 июл 2017 в 9:23
  • Суть в том, что в результате манипуляций с классом у вас меняется размер nav. Решение которое я предложил выше не совсем корректно: при обратном скролле верх нет плавного перехода к стандартной шапке. Выход прост: вынести определение ` var navPos = jQuery('nav').offset().top; ` вне скролла и использовать offset. Обновил пен: codepen.io/anon/pen/QgVgda?editors=1111
    – drch
    7 июл 2017 в 9:44
  • Еще один вопрос?Каким образом можно сделать плавный переход при добавление классa fixed. Сейчас как можно увидеть при переходе во второе состояние header резко перекрывает контент codepen.io/jSas/pen/vZzmQo
    – JavAs
    7 июл 2017 в 11:50

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.