I have made a simple Parallax Website link and when I croll with my mouse, it's just way to rough. On the other hand, when you visit this website, you will notice such a smooth scrolling.

How can I achieve that?

I have uploaded the source code of my website on GitHub.

Also, I have tried adding scroll-behaviour: smooth; and transition as well.

Thank You

CodePudding user response：

Try to add scroll-behavior: smooth; to body in your CSS. I tested on my end and worked for your website.

For smoother scrolling, maybe compress the image assets a bit more. They are pretty big.

Side Note: Do know that the parallax effect can be pretty bad for SEO.

To me, it looks fine: https://jsfiddle.net/1pw8bu2v/

Another side note: You may not have smooth scrolling enabled in Chrome. Please do check chrome://flags/#smooth-scrolling just in case to rule it out.