We can create smooth scrolling effect with CSS scroll-behavior Property.

This is how we can use it:


html {
  scroll-behavior: smooth;
}

When we click on in-page link, the browser will directly jump to that section/part but if we add the code above then the rather than jump, the scrolling will be smooth.

Syntax


scroll-behavior: auto or smooth or initial or inherit;

Where, 

auto will create a straight jump,

smooth will create a smooth animation,

initial will set the value to it's initial value and

inherit will set the value to it's parent's value.

0 Comments

Leave a reply

Your email address will not be published. required fields are marked *