A Smooth Scrolling Back To Top Button on Native JavaScript

UP Button is a simple but customizable and smooth scroll element implemented in Vanilla JavaScript. The initialize button, the call function (), in your js file, or in the HTML file, inside the script tag.

The button has standard styles defined in the css file, but it can be customized for a specific design by passing parameters to a function.

How to make use of it:

1. Insert the up button’s information into the doc.

<link rel="stylesheet" href="up_btn.css" />
<script src="up_btn.js"></script>

2. Initialize the library to generate a primary again to the top button.

up();

3. Customize the again to top button bypassing the next parameters to the up() function.

up({

  // bottom position
  bottom: '20px',

  // right position
  right: '20px',

  // width
  width: '45px',

  // height
  height: '45px',

  // background color
  bg: 'green',

  // custom icon
  src: './chevron-up-solid.svg',

  // distance from the top to show the back to top button
  whenShow: 400,

  // circular button?
  circle: true
  
});

Minimal Back To Top Button In Pure JavaScript, jquery scroll to top, UP Button Plugin/Github