ScrollSpy

Bootstrap Scrollspy is used to represents the current active link in the menu, based on scroll position.

The scrollspy has data-spy = "scroll" attribute, that can be used as the scrollable area (often this is the element).

The data-target attribute with the ID or class of the parent element of any Bootstrap .navbar component to indicate navbar is connected with scrollable area and nav links will be highlighted.

The optional data-offset attribute defines number of pixels which calculates the position of scroll from top.