When you drop down to a section in HTML, the corresponding navigation bar changes color.

  1. I want to set a navigation bar, then link to each section, and then when you slide down the page to that section, the corresponding navigation will change color. The effect is as follows


clipboard.png
.]

then I found out that during the internship, the css was

.
.site-navbar-light.scrolled .nav-link.active {
    color: -sharpFDA403 !important;

how is this active realized? slide to that block and then active. Does this involve the js side, rookie, please ask for advice, thank you!

Mar.16,2021

looks at the source code. In fact, the implementation of this is implemented in bootstrap.js. The source code address in the https://github.com/twbs/boots.
principle is actually not complicated, that is, it listens to the scroll event of the body element, and each time scroll calculates whether the target element specified in any navigation bar is in the current window. If so, add active class

to the corresponding navigation bar element.
Menu