Scrollspy is a bootstrap plugin that automatically updates links in a navigation list based on the current scroll position.
In the example below, scroll down the HTML page and note how the sections in the navigation bar are updated accordingly.
data-spy="scroll"attribute, added to the element, is meant to be used as the scrollable area. It is added to the
<body>element on line in the example above.
data-targetattribute is added with a value of the ID or the class name of the navigation bar. This connects the navigation bar with the scrollable area (line and line ).
<div id="section1">corresponds to
<a href="#section1">Section 1</a>in the
data-offsetattribute specifies the number of pixels used to offset from the top when calculating the position of the scroll. It is useful when the navbar changes its state too quickly during scrolling.
View all Courses