Bootstrap 5

Bootstrap Tutorials

Bootstrap 5 Scrollspy

Bootstrap 5 Scrollspy



Bootstrap 5 Scrollspy is used to automatically update links in a navigation list based on scroll position.


Creating Bootstrap 5 Scrollspy:-


Add data-bs-spy="scroll" to the element that should be used as the scrollable area.

Then add the data-bs-target attribute with a value of the id or the class name of the navigation bar. It makes sure that the current element is connected to the scrollable area.

Then scrollable elements must match the ID of the links inside the navbar list items. like div id matches with the link href value.

Code Explanation

All Tutorials related to Bootstrap Tutorials

All Sections related to Bootstrap 5