react-parallax

  • Version 3.5.1
  • Published
  • 492 kB
  • No dependencies
  • MIT license

Install

npm i react-parallax
yarn add react-parallax
pnpm add react-parallax

Overview

A React Component for parallax effect working in client-side and server-side rendering environment

Index

Classes

class Background

class Background extends React.Component<BackgroundProps, {}> {}

    class Parallax

    class Parallax extends React.Component<ParallaxProps, ParallaxState> {}

      Interfaces

      interface SplitChildrenResultType

      interface SplitChildrenResultType {}

        property bgChildren

        bgChildren: Array<ReactNode>;

          property children

          children: Array<ReactNode>;

            interface StyleObjectType

            interface StyleObjectType {}

              index signature

              [key: string]: string;

                Type Aliases

                type BackgroundProps

                type BackgroundProps = {
                className?: string;
                children?: React.ReactNode;
                };

                  type BgImageProp

                  type BgImageProp = string;

                    type BgImageSizesProp

                    type BgImageSizesProp = string;

                      type BgImageSrcSetProp

                      type BgImageSrcSetProp = string;

                        type BlurProp

                        type BlurProp = number | DynamicBlurProp;

                          type DynamicBlurProp

                          type DynamicBlurProp = { min: number; max: number };

                            type ParallaxChildrenProps

                            type ParallaxChildrenProps = {
                            className?: string;
                            children?: React.ReactNode;
                            onMount(node: HTMLDivElement): void;
                            };

                              type ParallaxProps

                              type ParallaxProps = {
                              bgClassName?: string;
                              bgImage?: BgImageProp;
                              bgImageAlt?: string;
                              bgImageSizes?: BgImageSizesProp;
                              bgImageSrcSet?: BgImageSrcSetProp;
                              bgImageStyle?: { [key: string]: any };
                              onLoad?: (event: Event) => void;
                              bgStyle?: { [key: string]: any };
                              blur?: BlurProp;
                              children?: React.ReactNode;
                              className?: string;
                              contentClassName?: string;
                              disabled?: boolean;
                              parent?: HTMLElement;
                              renderLayer?: (percentage: number) => any;
                              strength?: number;
                              style?: { [key: string]: any };
                              lazy?: boolean;
                              };

                                Package Files (1)

                                Dependencies (0)

                                No dependencies.

                                Dev Dependencies (42)

                                Peer Dependencies (2)

                                Badge

                                To add a badge like this onejsDocs.io badgeto your package's README, use the codes available below.

                                You may also use Shields.io to create a custom badge linking to https://www.jsdocs.io/package/react-parallax.

                                • Markdown
                                  [![jsDocs.io](https://img.shields.io/badge/jsDocs.io-reference-blue)](https://www.jsdocs.io/package/react-parallax)
                                • HTML
                                  <a href="https://www.jsdocs.io/package/react-parallax"><img src="https://img.shields.io/badge/jsDocs.io-reference-blue" alt="jsDocs.io"></a>