react-simple-parallax
A simple React Component for parallax effect on the front layer.
Install
npm install -S react-simple-parallax
Usage
; Component { return <section> <Parallax className="parallax" speedDivider="5"> <div>Hello World!</div> </Parallax> </section> ; }
Basic styling
/* .react-simple-parallax-bg is generate by the component */
Attributes
- speedDivider: controle translation speed (default: 5)
- backgroundStyle: to set the style of the background element with a javascript object (optional)
Example
{ var background = height: "1000px" backgroundImage: 'url(http://tinyurl.com/zaz7bp4)' return <section> <Parallax speedDivider="3" backgroundStyle=background>
Build the exemple
Initial set up
npm install
Install Webpack
npm install webpack -g
Build the exemple
webpack
Open /src/index.html
License
MIT