Skip to content
This repository has been archived by the owner on Nov 13, 2023. It is now read-only.
/ react-parlx Public archive
forked from parlx-js/react-parlx

parlx.js implementation for React component

License

Notifications You must be signed in to change notification settings

pmfawkes/react-parlx

 
 

Repository files navigation

NPM version NPM downloads

parlx.js implementation for React component

Demo

See plugin in action

How to Install

First, install the library in your project by npm:

$ npm install react-parlx

Or Yarn:

$ yarn add react-parlx

Getting Started

• Import plugin in React application file:

import ReactParlx from 'react-parlx';

• Later create parallax component and pass options:

<ReactParlx
  overlay={ /* true/false */ }
  settings={ /* settings */ }
  callbacks={ /* callbacks */ }
  className={ /* class name(s) */ }
  parlxMove={ /* event output destination */ }
  // other props for div tag e.g. style
/>

You can add components with or without additional content:

with:

<ReactParlx /* options */>
  // additional content
</ReactParlx>

without:

<ReactParlx /* options */ />

Props

Name Type Default Description Available options
overlay boolean false Create overlay for parallax container element true (enable) / false (disable)
settings object {} Default parlx.js settings parlx.js settings
callbacks object {} Default parlx.js callbacks parlx.js callbacks
className string parallax Parallax container class name Name of parallax container

Event

parlxMove event will output current position of the parallax element

License

This project is licensed under the MIT License © 2018-present Jakub Biesiada

About

parlx.js implementation for React component

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 100.0%