DEV Community

Cover image for How to make to top using 5 lines of jQuery

How to make to top using 5 lines of jQuery

Nishtha Neeraj Kushwah on July 16, 2021

Sometimes we find it hard to make a back to top button. And sometimes confused in many lines of code didn't understand what the error about is. Tod...
Read full post
Collapse
 
posandu profile image
Posandu •

Why use jQuery when there is a pure CSS solution ?

<body id="main">
    <div style="height: 2000px;">
      Scroll down
    </div>
    <a href="#main">Go to top</a>
</body>
Enter fullscreen mode Exit fullscreen mode

if you need smooth scroll

* {
       scroll-behavior: smooth;
  }
Enter fullscreen mode Exit fullscreen mode
Collapse
 
nishthaneeraj profile image
Nishtha Neeraj Kushwah •

I know this but I'm not satisfied with this because when I use this it adds a #idname in the url but in my solution it's not adding anything in my url

Collapse
 
posandu profile image
Posandu •

Then this is a single line PURE JS solution :D

<a onclick=" window.scrollTo(0,0);">Go to top</a>
Enter fullscreen mode Exit fullscreen mode
Thread Thread
 
nishthaneeraj profile image
Nishtha Neeraj Kushwah •

Thanks I don't know that thanks for this kind information