1.0.3 • Published 5 years ago

react-scrolling-progress v1.0.3

Weekly downloads
2
License
MIT
Repository
github
Last release
5 years ago

React scrolling progress

This is a simple React component that allows you to show a scrolling progress bar in your React app.

Installation

With Yarn:

yarn add react-scrolling-progress

With NPM:

npm i react-scrolling-progress

Usage

Default

This is the simpliest way to use the component.

import React from 'react';
import ScrollProgress from 'react-scrolling-progress';

const MyComponent = () => {
    return (
        <div>
            <ScrollProgress />
        </div>
    )
}

Customize

This will create a green bar, with height of 45px at the bottom of your website.

import React from 'react';
import ScrollProgress from 'react-scrolling-progress';

const MyComponent = () => {
    return (
        <div>
            <ScrollProgress
                position="bottom"
                backgroundColor="#1EE94D"
                barSize={45}
                />
        </div>
    )
}

Props

Prop nameTypeDefault value
stylesObjectDefault component styles
positionString, one of: 'top','bottom', 'left', 'right'top'
classNamestring'progress-bar'
barSizenumber or string20