11 JavaScript Back to Top

By | October 10, 2021

This demo collection is a collection of javascript back to top demos and examples which aim to show how JavaScript can be used to add back button functionality for web pages. It includes demos for showing, animating, and hiding the back to top button. The demos are done with JavaScript, HTML, and CSS only.

Author

  • Qbrid
  • November 1, 2016

Link

Made with

  • HTML / SCSS / JS

About the Code

Scroll to top button in React JS

More info: Link

Dependency: bootstrap.min.css, react.min.js


Author

  • Ethiel ADIASSA
  • April 11, 2017

Link

Made with

  • HTML / SCSS / JS

About the Code

Back to top component with Vuejs

A back to top reusable component with Vuejs

More info: Link

Dependency: bootstrap.min.css, font-awesome.min.css, vue.min.js, jquery.min.js, bootstrap.min.js


Author

  • Carlos Henrique Reis
  • August 28, 2018

Link

Made with

  • HTML / CSS / JS

About the Code

Scroll Back To Top Button with vuetify

More info: Link

Dependency: fonts, vuetify.min.css, polyfill.min.js, vue.js, vuetify.min.js


Author

  • Qbrid
  • October 22, 2016

Link

Made with

  • HTML / Sass / JS

About the Code

Scroll to top button in Vanilla JavaScript

More info: Link

Dependency: bootstrap.min.css


Author

  • Josh Masen
  • May 31, 2019

Link

Made with

  • HTML / SCSS / JS

About the Code

ES6 Scroll-to-top button

More info: Link

Dependency:


Author

  • Maria Z
  • November 30, 2016

Link

Made with

  • HTML / CSS / JS

Author

  • Alexandr Kazakov
  • March 28, 2017

Link

Made with

  • HTML / SCSS / JS

About the Code

Back-to-Top Button Vanilla JS

More info: Link

Dependency: JavaScript back to top developed using Vanilla JS


Author

  • Adam Morsi
  • July 2, 2019

Link

Made with

  • HTML / SCSS / JS

About the Code

React back to top component

More info: Link

Dependency: react.development.js, react-dom.development.js, Tween.min.js


Author

  • EJ
  • December 23, 2019

Link

Made with

  • HTML / SCSS / JS

About the Code

auto hiding back to top button on scroll up – vanilla JS

More info: Link

Dependency:


Author

  • Eric Porter
  • May 27, 2017

Link

Made with

  • HTML / SCSS / JS

About the Code

Back To Top buttons – FontAwesome icons

More info: Link

Dependency: font-awesome.min.css, jquery.min.js, jquery-ui.min.js


Author

  • Keenan Staffieri
  • March 29, 2015

Link

Made with

  • HTML / SCSS / JS

About the Code

Click JavaScript Back to Top Autoscrolling

More info: Link

Dependency: JavaScript back to top


Author: CV

I am a Front-end Developer, graduate of Information Technology, and founder of w3tweaks.com. I have 12+ years commercial experience providing front-end development, producing high quality responsive websites and exceptional user experience.