scrollspy query


Topic: scrollspy query

Damien Cussen pro premium priority asked 3 years ago

Im using one of your templates (halfpage image carousel) as a basis for a new site i am working on and I am looking to add the scroll spy behaviour (not working) and smooth scroll (working)

So i did the following to the template:

  1. Adjusted the body tag to this:
  2. Added an ID to the nav class:
  3. Picked two of the links to edit and added the following: Home (current)
  4. About MDB
  5. Added the following to the sections:
About MDB Not enough?

Smooth scroll is working fine - the scroll spy isnt. When i inspect in chrome console i can see the active class is not being assigned.


Piotr Glejzer staff answered 3 years ago

Hello,

we will check it and test it. If it will be work we will let you know. Thanks.

Best,
Piotr


Damien Cussen pro premium priority answered 3 years ago

HTML dropped when i submitted query: Step 1 - Body Edit:

<body data-spy="scroll" data-target="#navbarxyz" data-offset="0">

Step 2 - Nav Class ID

<nav  class="navbar fixed-top navbar-expand-lg navbar-dark scrolling-navbar" id="navbarxyz">

Step 3 - Link Updates

           <li class="nav-item active">
          <a class="nav-link" href="#navbarxyz-section1">Home

          </a>
        </li>
        <li class="nav-item">
          <a class="nav-link" href="#navbarxyz-section2" target="_blank">About MDB</a>
        </li>

Step 4 - Section Updates

<h3 id="navbarxyz-section1" class="h3 text-center mb-5">About MDB</h3>
<h2 id="navbarxyz-section2" class="my-5 h3 text-center">Not enough?</h2>

Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: Yes
  • Technology: MDB jQuery
  • MDB Version: 4.8.11
  • Device: PC
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No