react-scroll-toggle

react-scroll-toggle is react parent component to add provided class when a user is scrolling page.

Installation

Use the manager npm to install

npm install react-scroll-toggle --save

import React from 'react';
 
import ScrollToggle from 'react-scroll-toggle';
 
class App extends React.Component {
    render() {
        return (
 
            <ScrollToggle>
                <div>
                    Animated element
                </div> 
            </ScrollToggle>
 
        );
    }
}

options

    
    <ScrollToggle
        className="SlideIn" //required property
        scroll={300} //by default distance before child element
    >
        <div className="Container">Animated element</div>
    </ScrollToggle>

renders => <div class="Container SlideIn">Animated element</div>