Back to Top Button with jQuery

Buttons allowing you to scroll back to the top of a page are quite common these days. Recently, I needed a back to top button for one of my SoftUni projects, and I did the necessary research so you don’t have to. You can see a live example at softuni.myowndesigns.info.

The idea here is when a user scrolls down past a certain point on a website, to see a button, allowing him to smoothly scroll back to the top. This is convenient and improves the user’s experience.

What you will need is to add HTML for the markup of the button, jQuery for its behavior and CSS for styling. Optionally, you may need to add Font Awesome for the up arrow should you wish to replace the button’s text with it.

You can download jQuery directly from jquery.com and then link to it from the head section of your HTML: