scrolling-based-progressbar

> React Progress bar whose value changes based on scrolling

 

Install

``bash
npm install scrolling-based-progressbar
`

Demo

> https://progressbar-demo.netlify.com/

Preview


Usage

`jsx
import React, { Component } from 'react'

import { ProgressBar } from 'scrolling-based-progressbar';

class Example extends Component {
render () {
return (

or

)
}
}
`

Default values

color="red"

bgColor="transparent"

height="5px"

borderRadius = '0'

zIndex = '100000000'

top = '0'

left = '0'

position = 'fixed'

ContainerStyle & ProgressBarStyle

> Using ContainerStyle & ProgressBarStyle you can define in-line style for ProgressBar

$3

`

ContainerStyle={{backgroundColor:'#a7caed',bottom:'0',top:'none'}}
ProgressBarStyle={{backgroundColor:'#1976d2'}} />

`

Note

> Use in each separate component where you want progress bar

#### Wrong
`
function App() {
return (
















);
}
``
#### Right


>Use in each component( Home , Auth , Order , Contact , DetialsProduct ) separately

License

MIT © ValeedAnjum