10 Best Back To Top Plugins In jQuery And Pure JavaScript (2024 Update)
Whether you're writing a long blog post or just a short one, it's always nice to have a "back to top" (also called scroll to top) button so your readers can easily jump back to the top of the page.
A Back To Top button enables the users to smoothly scrolls the page back to the top when they reach the very bottom of the document.
While there are a lot of smooth scroll solutions that allow you to implement a scroll to top functionality on any element, you might also need a back to top plugin to make things simple.
In this roundup, we'll take a look at 10 best and top-downloaded jQuery/JavaScript back to top plugins that make it easy to implement a scroll to top functionality on your long webpage to enhance the user experience.
Some are simple, while others offer more features and options. But all of them will help keep your readers happy and engaged. So without further ado, let's get started!
Originally Published May 17 2019, updated Feb 07 2024
Table of contents:
jQuery Back To Top Plugins:
Smooth Back To Top Button With Scroll Progress Indicator
A jQuery/CSS/SVG based smooth back to top button with a circular progress bar which indicates the current reading progress when scrolling down/up the webpage.
Customizable Back To Top Button Plugin For jQuery - backToTop
Just another jQuery scroll to top plugin which generates a highly customizable, CSS3 animated back to top button on the long webpage for better readability.
Smooth Back To Top Button In jQuery
A tiny jQuery script for creating a custom smooth back to top button that automatically fades in/out on page scroll.
Highly Customizable Floating Back To Top Button With jQuery
Yet another jQuery scroll to top plugin for displaying a fully configurable floating button when scrolling down that allows the user to quickly and smoothly scrolls the page to the top.
Animate Scrolling To The Top Of The Page - jQuery backtothetop.js
A jQuery back to top plugin that enables users to smoothly scroll back to the top of any page on your website using a highly customizable button, helping you keep your site sticky and generating leads.
Vanilla JS Back To Top Libraries:
Animated Back To Top Button With JavaScript And CSS3
A beautiful animated back to top button that auto reveals & hides when scrolling through the page. This animated back to top button also can work on mobile devices nicely.
Minimal Back To Top Button In Pure JavaScript – up-button
A minimal yet customizable and smooth scroll to top button component implemented in vanilla JavaScript.
Minimal Back To Top Button – scrollToTop.js
A tiny JavaScript library that enables a fixed button to navigate your page back to the top at a given speed.
Tiny Customizable Scroll To Top Button – ue-scroll-js
A tiny JavaScript plugin to display a customizable ‘Scroll To Top’ button at the bottom of the webpage when scrolling down.
vanilla-back-to-top
An animated, highly customizable back to top button for scrolling the page to the top. Written in pure (vanilla) JavaScript.
Conclusion:
With this list you will have a lot of resources to help create an elegant and functional back to top button for your website.
We hope that one or two plugins from the 10 best jQuery/JavaScript back to top plugin list can be used as part of your next project! If none feel right, we’ve also included some other popular options below.
Let us know if there are any questions about how these work or which might be best suited for what you need.
Looking more jQuery plugins or JavaScript libraries to create awesome Back To Top buttons on the web & mobile? See jQuery Back To Top and JavaScript Back To Top sections for more details.
See also:
- Top 10 Smooth Scroll JavaScript Libraries
- 10 Best Mobile-friendly One Page Scroll Plugins
- 10 Best Scrollspy Plugins In JavaScript
- 10 Best Smooth Scroll Plugins In jQuery And Pure JavaScript
