Topic: ScrollSpy Not Working
chrisbowyer pro asked 5 years ago
Start your code here<body style="position: relative;" data-spy="scroll" data-target=".navbar-nav"> <!-- Start your project here--> <header> <nav class="navbar navbar-expand-lg navbar-dark bg-dark fixed-top"> <a class="navbar-brand" href="/">ScrollSpy Test</a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="##navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav mr-auto"> <li class="nav-item"> <a class="nav-link" href="#one">One</a> </li> <li class="nav-item"> <a class="nav-link" href="#two">Two</a> </li> <li class="nav-item"> <a class="nav-link" href="#three">Three</a> </li> </ul> </div> </nav> </header> <section id="one" style="padding: 65px 15px 1000px"> <p>One</p> </section> <section id="two" style="padding: 65px 15px 1000px"> <p>Two</p> </section> <section id="three" style="padding: 65px 15px 1000px"> <p>Three</p><br> </section> <!-- /Start your project here-->
Mikołaj Smoleński staff answered 5 years ago
chrisbowyer pro commented 5 years agoHi, Mikołaj. Thanks for getting back to me - and so quickly :) As for the issue, it appears you missed the fact that I am using data attributes. In fact, the only thing required to fix the issue was adding the CSS - which ponders the question, shouldn't your stylesheet include this anyway? Alternatively, maybe something in your CSS and or JS is breaking what otherwise works fine when using Bootstrap alone.
Mikołaj Smoleński staff commented 5 years agoThis CSS code is not included to give every client possibility to change active element style as they want. After adding above lines to code, CSS and JS are not breaking.
chrisbowyer pro commented 5 years agoFair enough. However, it would be helpful to mention this anomaly in the documentation.
Mikołaj Smoleński staff commented 5 years agoThanks for advice. We'll think about it. Regards
karinathill free commented 9 months ago
Now a days all kinds of screen modification is done with the use of https://crackcut.com/classroom-spy-professional/ It helps the new user a lout.
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
- User: Pro
- Premium support: No
- Technology: MDB jQuery
- MDB Version: -
- Device: -
- Browser: -
- OS: -
- Provided sample code: Yes
- Provided link: No