Back To Top button using Javascript

JavaScript
1

Hi folks,

I’m completely new to Javascript coding.

I would like to have a Back To Top button in the bottom right corner of the viewport. I figured that Javascript would be used for this, and after some searching, I found this Jump To Top Link script at DynamicDrive. I’m sure I could easily change its appearance from a link to a button but I don’t like the jerky scrolling effect. I wondered if you guys could explain to me how to make the button (or link in the script’s case) stay in the bottom right corner of the viewport at all times instead of scrolling?

Better still, is there a way of doing this with CSS?

2

Something like this:


<a href="#top" id="toplink">Go to the top</a>



#toplink {
    position: fixed;
    bottom: 10px;
    right: 10px;
    line-height: 30px;
    height: 30px;
    color: white;
    background: black;
}
3

Or just <a href=“#” id=“toplink”>Go to the top</a>.

4

Thank you fredda but I was looking for something like what JimmyP posted. I already know about the

<a href="#" id="toplink">Go to the top</a>

technique but I wanted it to stay at the bottom right corner of the viewport.

Cheers JimmyP, I’ll play around with that and see what I get. :wink: