Плагін перемикає така поведінка і вимикається (змінює значення позиції CSS від статичного до фіксованої), в залежності від положення прокрутки.
Приклад 1) прикріплену Navbar:
Приклад 2) прикріплену бічній панелі:
За допомогою афікса, коли ми прокрутки вгору і вниз сторінки, меню завжди видно і замкнули в його становищі.
Як створити прикріплену меню навігації
У наступному прикладі показано, як створити горизонтальне меню навігації, прикріплену:
У наступному прикладі показано, як створити вертикальне меню навігації, прикріплену:
приклад Роз'яснення
Додайте data-spy = "affix" до елементу ви хочете прикріплене.
При бажанні, додати data-offset-top | bottom атрибут для обчислення положення прокрутки.
Як це працює
Афікс плагін дозволяє перемикатися між трьома класами. affix. affix-top. і .affix-bottom. Кожен клас представляє собою певний стан. Необхідно додати властивості CSS для обробки фактичні позиції, за винятком position: fixed на .affix класі.
Плагін додає .affix-top або .affix-bottom клас. щоб вказати елемент знаходиться в його саме верхнє або нижньому положенні. Позиціонування за допомогою CSS не потрібно в даний момент.
Прокрутка повз прикріпленим елемента викликає фактичне прикріплення - Це де плагін замінює .affix-top або .affix-bottom класу з .affix класу (встановлює position: fixed). На даний момент, ви повинні додати CSS top або bottom властивість позиціонувати прикріплену елемент на сторінці.
Якщо зсув дна визначається, прокрутка повз нього замінює .affix клас з .affix-bottom. Так як зміщення не є обов'язковими, установка одного вимагає, щоб встановити відповідний CSS. В цьому випадку додати position: absolute при необхідності.
У першому прикладі вище, плагін Афікс додає .affix клас (позиція: фіксована) на
Scrollspy афікс
Використання Афікс плагін разом з Scrollspy плагін:
Горизонтальне меню (Navbar)
Вертикальне меню (Sidenav)
Повний Bootstrap афікс Reference
Для повного віднесення всіх проставляти методи і події, перейдіть на наш Bootstrap JS афікс Reference.