Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: Problem with smooth-scroll

oddooo48 free asked 6 years ago


Hi! I try to use smooth-scroll but it doesn't work. It goes to the named id on the page, but without animation. I installed the mdb like a moment ago, done the whole tutorial about instalation. What can I do?   Thanks
<nav id="navbar-follow" class="navbar navbar-expand-sm fixed-top navbar-dark flex-nowrap" style="background-color:#222;">

<divclass="navbar-collapse collapse">

<ulclass="smooth-scroll navbar-nav nav-pills mx-auto ">

<liclass="nav-item">

<ahref="#services"class="nav-link">Services</a>

</li>

<liclass="nav-item">

<ahref="#portfolio"class="nav-link nav-outline-success">Portfolio</a>

</li>

<liclass="nav-item">

<ahref="#about"class="nav-link">About</a>

</li>

<liclass="nav-item">

<ahref="#contact"class="nav-link">Contact</a>

</li>

</ul>

</div>

</nav>

<div data-spy="scroll" data-target="navbar-follow" data-offset="0">

<header>

<divclass="container">

<divclass="intro-text">

<divclass="intro-lead-in">...</div>

<divclass="intro-heading">...</div>

</div>

</header>



<section id="services">...</section>

<section id="portfolio">...</section>

<section id="about">...</section>

<section id="contact">...</section>

</div>

Arkadiusz Idzikowski staff answered 6 years ago


Dear oddooo48, Do you need to use smooth scroll in Angular or jQuery app? In order to use it in Angular you need to add our mdbPageScroll directive. You can find more examples here: https://mdbootstrap.com/angular/advanced/smooth-scroll/ Regards, Arek  

Please insert min. 20 characters.

FREE CONSULTATION

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

Status

Resolved

Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: 6.2.2
  • Device: Laptop
  • Browser: Chrome
  • OS: Windows 10
  • Provided sample code: No
  • Provided link: No