Hello friends, today I will tell you through this post how you to scroll the top of the page Using Javascript or Jquery. So let’s go.
You can scroll the page to the top very easily with javascript. Now I will tell you in 2 steps how to do it. So let’s go.
Step 1:- Create HTML File Write HTML Code(scroll-top-page.html).
Step 2:- Add JavaScript Code.
Step 1:- Create HTML File Write HTML Code(scroll-top-page.html).
<!DOCTYPE html> <html> <head> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <meta charset="utf-8"> <title>Scroll to the top of the page with jQuery</title> </head> <body> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <p>jquery scroll top of the page</p> <a href='#top'>Go To Top</a> </body> </html>
Step 2:- Add JavaScript Code.
<script>
$("a[href='#top']").click(function() {
$("html, body").animate({ scrollTop: 0 }, "slow");
return false; });
</script>