Topic: smooth-scroll not working correctly

Claude Vital free asked 5 years ago

Hi guys

I implemented smooth-scroll but the points that the page scrolls to, are sometimes not correct. it's strange. Specially if you click on the left purple circle on top of page. I added the .smooth-scroll to the links and added the ID (target) to the h3 tags, but it's not working as expected. Please support me, what I'm doing wrong, or is it a bug? - check yourself.

If you need any code, please advise. I'm using MDB PRO 4.7.6thanks in advance

Bartłomiej Malanowski staff commented 5 years ago

What's wrong? It's working fine for me

Sebopede free answered 4 years ago

Greetings all, i have run into a problem with Smooth Scroll.

When adding this my angular project, the website does indeed scroll to the desired section.

But it is not easing. The smooth scroll should be Smoooooth. But when using it on my website, it is not smooth at all, in fact it is quite glitchy. I am also not receiving any errors in my console, which makes it quite hard to debug. Am i supposed to mess around with the easing through scss. or is this component not functionning properly with angular 9.

Please advise, and thanks for the help.

Grzegorz Bujański staff commented 4 years ago

Hi. Did you use MDB jquery in your Angular project or you use MDB Angular? If your use MDB Angular please create new topic and select Angular in technologies list. There they will help you.

Claude Vital free answered 5 years ago

as I wrote, ma solution was to not implement bith of this pro-addons because they're not compatible each other. so, it's more a must-do action, than a solution.

Claude Vital free answered 5 years ago

Ok, guys my problem is solved, but your support is really bad. Two of your addons (Timeline and smooth-scroll) not working correctly together. I paid for this, so, if I found out a BUG, why you don't take this in a serious and fast way? That's not a Premium support, it's no support. So, I think, it was not worth to pay 149 euros for this. The free version really is enough for most users because, what you will pay is not premium support and some of the pro-addons not work together.

Bartłomiej Malanowski staff commented 5 years ago

For the first, I'm really glad you've found a solution to your issue. Could you please share it as a reply? This would be helpful to others. I'm sorry to hear, you're not satisfied with the support. I'll do my best to improve myself in the next time, you'll ask us a question!

Claude Vital free answered 5 years ago

Hi BartłomiejThat's what I originally did. Now I did it again and as you can see, there is no effect to that bug. What has an effect, is, that if you load the page and do NOT any scrolling, then "smooth-scroll" works correctly and jumps to the right point. If you do ANY scrolling action before clicking on the link, the result is the wrong behavior.

The MDB-Team has re-written the "wow"-script, so that there must be a scroll-action from user to hide elements. Maybe there is a conflict with this, please check.

Best regards claude

Claude Vital free commented 5 years ago

Update: I copied the page to local and did several tests. As I found out, the problem is the addons-pro/timeline.js which animates the timeline on scroll... as soon as I remove the script, everything works fine with smooth-scrolling. So, is there any possibility to implement both of these pro addons on same page?

Yes, thank you - I'm able to reproduce it now. As I can see, you've added an ID to the h3 element instead of section where it's wrapped. Can you do it?

Claude Vital free answered 5 years ago

Thank you for your answer!

Please check on mobiledevice, or screen-shrinking to mobile-viewportsize and do following:

  1. go to
  2. klick on the second circle with light-green text (Lern- und Spielnachmittag).1
  3. notice the point where it's finally scrolling to, it's not the point where the anchor is placed. On my mobile (OnePlus5) the scrolling point is between the pictures of the section. 2 But it should be more above. The place of Anchor is in h3 tag with the light-green painting-line below, it's called "Lern- und Spielnachmittag". 3

After e second click on the link, the scrolling position is mostly OK. Maybe the "wow" script can be a problem, so I removed the fadeInUp class and placed only fadeIn instead, but same result.

Hope you can reproduce and help me out.

Thanks in advance.

Please insert min. 20 characters.


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



Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: 4.7.5
  • Device: Desktop/Mobile
  • Browser: Chrome
  • OS: OSX
  • Provided sample code: No
  • Provided link: Yes