Jeremboo / react-parallax-component

Easiest way to add scroll parallax effect on the component

Home Page:http://andreykeske.com/#/en/places/2015/August/Tallinn

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

React Parallax Component

Easiest way to add scroll parallax effect on the component.

image

Installation

npm install react-parallax-component

Usage

import ParallaxComponent from 'react-parallax-component';

<ParallaxComponent speed="0.003"
                   width="300"
                   top="40%"
                   left="100">
  <div>
    Children component
  </div>
</ParallaxComponent>

Props

  • speed (String) - animation speed, default: -0.03
  • width (String) - component width, default: auto
  • height (String) - component height, default: auto
  • top (String) - component top position, default: inherit
  • left (String) - component left position, default: inherit
  • right (String) - component top position, default: inherit

Development

$ npm install

Run app

$ npm start

And open in browser: http://localhost:4000

Build

$ npm run build

About

Easiest way to add scroll parallax effect on the component

http://andreykeske.com/#/en/places/2015/August/Tallinn


Languages

Language:JavaScript 91.1%Language:CSS 5.9%Language:HTML 3.0%