Minimalist Back To Top Button With Pure JavaScript – Subir.js

Category: Javascript | December 24, 2016
Author: theuves
Views Total: 767
Official Page: Go to website
Last Update: December 24, 2016
License: MIT

Preview:

Minimalist Back To Top Button With Pure JavaScript – Subir.js

Description:

Subir.js is an ultra-light JS library used to display a ‘Back To Button’ as you scroll down a certain distance from the top of the webpage. Clicking on the ‘Back To Button’ will smoothly the webpage back to the top.

How to use it:

Import the JavaScript file Subir.js into the html document.

<script src="subir.js"></script>

Create the ‘Back To Top’ button.

<input type="button" value="Top" id="top">

Stylize the ‘Back To Top’ button.

#top {
  position: fixed;
  right: 10px;
  bottom: 10px;
}

Initialize the ‘Back To Top’ button  as follow:

subir('#top');

Available parameters:

  • sl: CSS selector for the back to top button
  • pc: distance from top to display the back to top button
  • ms: animation duration
subir(sl, pc, ms)