jQuery creates smooth page scrolling (top or bottom)_jquery

In this article, I will show you through this tutorial how to create a smooth scrolling effect using jQuery. Allows you to scroll to the top or bottom of your webpage

How it works
First, load the jquery library before the end of the tag:

Copy code The code is as follows:

jQuery scroll to the bottom:

Link:
Scroll to bottomjQuery

Copy code The code is as follows:

How it works:
The first line of code is executed before the page loads
$(document).ready(function(){When the connected .scrollToBottom class is clicked, execute the action in {}

$(document).ready(function(){
$('a.scrollToBottom').click(function(){
});
}) In this function, execute this code
$('html, body').animate({scrollTop : $(document).height()}, 'slow');
return false; When a link is clicked, the code will be run inside the function. The function of scrollTop is to use the smooth scrolling effect. Page bottom, using the height of the window to determine the bottom height. Use 'slow', 'medium' and 'fast' speed controls, I used 'slow'.
jQuery Scroll to Top
First, insert a link into the footer section of your page, the jQuery code will execute when clicked. Animation features. is very important because it is the link that references the class in jQuery.
Link:
Scroll to bottomjQuery

Copy code The code is as follows:

How it works :
When a class is loaded on the page. jQuery will execute this when scrollToTop link is clicked
$('html, body').animate({scrollTop:0}, 'slow');
return false; .animate() method allows us to To animate any numeric CSS property, set the scrollTop function to 0, which represents the topmost position of the scroll bar. "slow" refers to the speed at which the animation will run. In this line you will notice:
return false;This prevents the default action from being triggered by the event, in our case it prevents the user from linking.
can also be like this:

Copy the code The code is as follows:

event.preventDefault();