Я этой статье я расскажу как зафиксировать меню при прокрутке страницы. Причем этот скрипт универсален, прост в использовании и подойдет к любому меню.
Пару слов о скрипте. Скрипт работает по такому сценарию:
- Находит ul меню заданного класса
- Задает ему ширину меню
- Оборачивает его в div
- Задает этому блоку высоту меню
- При прокрутке страницы добавляет position:fixed;top:0;
Оборачивание меню в блок исключает скачек при фиксации меню . Получается контейнер приобретает высоту меню и играет роль «отпечатка».
Схематически это выглядит вот так
Установка
Скрипт требует подключения jQuery
Шаг 1. Скачайте и подключите внешние скрипты
Шаг 2. Добавьте класс .menutofix к Вашему меню
О том как узнать код меню можно прочитать тут. Затем откройте шаблон главной страницы вашего сайта, найдите код Вашего меню который начинается на
<ul ....
Если он выглядит примерно вот так
<ul class="text" ....
(у Вас будет вместо text, что то другое)
то class=» замените на class=»menutofix
class="text
на
class="menutofix
не забудьте поставить пробел после menutofix
Вот собственно и все.