JavaScript - How to Add Smooth Scrolling Anchor Links to Jump to a Specific Part of a Web Page

In this tutorial you'll learn how to scroll up or down a website using an anchor link with JavaScript.

Sponsor me on GitHub!

Follow my blog:

[destinyobamwonyi]

This video deserves way more likes simple and straight forward, thanks.

[MuhammadHassan-qhsm]

looking forward for more awesome content like this😍

[ayla]

Thank you! This tutorial helped me so much!

[MuhammadHassan-qhsm]

thank you very much sir, it made my concept clear

[UNIWORKER]

The easiest method to turn on smooth scroll I've ever seen. LIKE !

[jordanaldrich]

This is EXACTLY what I needed! Thank you so much!!! *** It doesn't smooth scroll on mobile? How come??? ***

[Amirhosseindev]

man thank you alot for sharing your knowledge with us this helped me so much again thank you for this quick and easy to use content<3

[tomaspaiva]

How do I add custom scroll duration?, thanks

[firedforfighting]

Using your codepen I cant find a difference between this and the css

html{
scroll-behavior: smooth;
}

let me know if you can thanks!

[karinwillekes]

Thank you for sharing this tutorial. I have a question. On my website are anchor points. So thats working fine. But i to smoothly automatic scroll to a section, without clicking on the anchor points. So when somebody starts scrolling with the mouse, the next section smoothly scrolls in viewpoint. How can i do that?

[juanpedrotrionfini]

Hi, i do it with a transition (css only). Why would it be better this way?
What happened to the other challenges? There are 12 of 25. They are very good, it continued like this ...

[mitsyleague]

What is that "^" you used between the href and the "#"?

[ipsitsaha]

once I implement this if I add any other pages links in href it is not working..

[Ramkirat]

on mobile its not working as we expect. any solution ?

[CulturalToast]

Why wouldn't you use the scroll-behaviour: smooth; css property tho? Loading in excessive js is nonsensical imo.

[hollywoodexplained]

Man I just find like this project, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, Thank you, very much.