PageProgress

A very simple and lightweight page progress indicator : demo

Installation

npm install pageprogress

Usage

import PageProgress from 'pageprogress';

const progress = new PageProgress({
  position: 'left',
  width: 8,
  color: '#000000'
});

progress.init();

If you want to remove the native scroll bar, add these lines to your main CSS file :

/* Chrome, Safari, Opera */
::-webkit-scrollbar {
  display: none;
}

/* Firefox */
* {
  scrollbar-width: none !important;
}

/* IE, Edge */
body {
  -ms-overflow-style: none;
}

Options

Option	Type	Default	Description
container	object	document.body	Container used to calculate page height
position	string	right	top, right, bottom, left
width	number	8
color	string	#000000

Instance methods

init()

Add progress indicator to the DOM, listen to scroll event.

destroy()

Remove listener and progress indicator from the DOM.

Browser support

Works on most modern browsers. Chrome, Firefox, Safari, Edge... To get IE support, you may need polyfills.

License

MIT, see LICENSE.md for details.