Главная страница » Блог » Как скрыть оглавление сайта при прокрутке страницы вниз?

Как скрыть оглавление сайта при прокрутке страницы вниз?

Как скрыть оглавление сайта при прокрутке страницы вниз?

Чтобы скрыть оглавление (меню) при прокрутке страницы вниз, нужно воспользоваться CSS-стилями и JavaScript-кодами. Для этого достаточно добавить следующий код в файл стилей вашего сайта:

css

.navbar {

position: fixed;

top: 0;

}

При достижении определённой точки прокрутки (например, 50px от верхней части экрана), можно применить скрипт, который будет скрывать меню автоматически:

javascript

window.onscroll = function() {

if (document.documentElement.scrollTop > 50) {

document.querySelector('.navbar').style.display = 'none';

} else {

document.querySelector('.navbar').style.display = 'block';

}

};

📌 Мини-чек-лист настройки скрытия оглавления:

  1. Добавьте фиксированное позиционирование для меню через CSS.
  2. Создайте простой скрипт отслеживания прокрутки страницы.
  3. Проверьте корректность отображения элементов после применения изменений.

Важно помнить, что правильное использование скриптов требует тестирования на разных устройствах и браузерах, чтобы избежать ошибок отображения.

Внимание:
Условия: Внедрение системы — от 50 000 ₽/мес. Если бюджет подходит — посмотреть тарифы →
Прокрутить вверх