@Gagatyn
Самоучка

Как сделать фиксированное меню при скороллинге стр?

Здравствуйте. Проблема в том, что когда я сделал фиксированное меню при скролинге до определенного момента стр, весь контент прыгает вверх. Понятно, что меню выбивается из иерархии и контент занимает его место, как сделать так чтобы меню плавно/резко фиксировано скролилось вместе с стр и контент не прыгал?
  • Вопрос задан
  • 898 просмотров
Решения вопроса 1
MacFiss
@MacFiss
человек
Создаете модификатор блока .header, например .header--fixed.

.header
  height 60px
  background #000
  &--fixed
     position fixed
     left 0
     top 0


Со стороны JS делаете проверку:
$(window).scroll(function() {
  var container = $('.header');
  var status = $(this).offsetTop >= container.height() ? true : false;

  container.toggleClass('.header--fixed', status);
});


Либо делаете сразу фиксированным .header и создаете отступ у контейнера который оказывается под .header
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 1
RodgerFox
@RodgerFox
2 решения:
  1. Сразу фиксированное позиционирование и добавлять отступы у контента или у бади
  2. Добавляем класс для контента или бади с нужным отступом, либо берем высоту нашего меню и инлайним ксс с нужным паддингом
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы