0.1.0 • Published 8 years ago
react-headspace v0.1.0
react-headspace
An implementation of headspace, using React.
It is a next generation web header that displays when needed, as seen on websites such as Medium.
Demo
See demo from the headspace repository.
Getting started
Install react-headspace into your project.
npm install --save react-headspaceTo use, import it into your component and wrap it around your Header.
import Headspace from 'react-headspace';
const MyAwesomeHeader = () => (
<Headspace>
<h1>I am in the header!</h1>
</Headspace>
);API
| Property | Description | Default |
|---|---|---|
| scrollTolerance | number: How many pixels we have to scroll before we show/hide the header | 5 |
| showAtBottom | boolean: Should we show the header when we are on the bottom of the webpage | true |
| children | node: Your header content that will be wrapped | none |