https://github.com/pie6k/react-smart-sticky
SmartSticky is React component for sticky topbar that will hide when scrolling down and show when scrolling up.
https://github.com/pie6k/react-smart-sticky
component react react-component scrolling
Last synced: about 1 month ago
JSON representation
SmartSticky is React component for sticky topbar that will hide when scrolling down and show when scrolling up.
- Host: GitHub
- URL: https://github.com/pie6k/react-smart-sticky
- Owner: pie6k
- Created: 2016-09-30T20:45:23.000Z (over 8 years ago)
- Default Branch: master
- Last Pushed: 2019-05-15T04:26:57.000Z (almost 6 years ago)
- Last Synced: 2025-03-02T00:32:03.526Z (2 months ago)
- Topics: component, react, react-component, scrolling
- Language: JavaScript
- Homepage:
- Size: 2.77 MB
- Stars: 14
- Watchers: 2
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
Awesome Lists containing this project
README
# React Smart Sticky
[Online Demo](https://pie6k.github.io/react-smart-sticky/examples/dist/)
## Features
* Works like topbars in native applications (Facebook, Medium.com, Instagram etc.)
* Works on mobile devices
* Topbar dissappears 'with the flow' of scrolling - if you'll stop scrolling - sticky element will stop it's movement too.
## Usage
```sh
npm install react-smart-sticky --save
```
```js
import SmartSticky from 'react-smart-sticky';
...
Some topbar content or whatever you need
```
## Additional options
```js
Some topbar content or whatever you need
```
`tolerance` is ammount of pixels needed to be scrolled before sticky element will start to show/hide.
## Licence
MIT