react-intersection-visible

HOC-wrapper Component that helps you track when an element enters in the viewport. It uses the new IntersectionObserver API with polyfill fallback

Demo

How to use

1. Import IntersectionVisible hoc component
2. Wrap your main component with the IntersectionVisible
3. Provide the options and callbacks you want

Example

```javascript import React, { Component } from 'react'; import ReactDOM from 'react-dom'; import IntersectionVisible from 'react-intersection-visible';

class YourComponent extends Component {

onHide( entries )
{
    // do something
}

onShow( entries )
{
    // do something
}

onIntersect( entries )
{
    // do something
}

render(){
    return (<IntersectionVisible onIntersect={ e => this.onIntersect( e ) }
                                 onHide={ e => this.onHide( e ) }>
                                 onShow={ e => this.onShow( e ) }>



                    blah blah blah  blah blah blah  blah blah blah  blah blah
                      blah blah blah  blah blah blah  blah blah blah



            </IntersectionVisible>);
}

}

```

Options:

More about the options here

Contribute

Any pull-request is more than welcome :boom: :smile:

License

MIT