react-css-parallax

1.1.1 • Public • Published

react-css-parallax

A css-based parallax background to be used with react

NPM JavaScript Style Guide

Demo

https://kevinrodriguez-io.github.io/react-css-parallax

Install

npm install --save react-css-parallax

Features

  • Relies on backgroundAttachment
  • Supports fixed to disable the parallax effect
  • Simple, customizable api
  • Adds underlying, hidden img tag when alt is present
  • Supports passProps

Usage

import React, { Component } from 'react'
 
import Parallax from 'react-css-parallax'
 
class Example extends Component {
  render () {
    return (
      <Parallax src="https://kevinrodriguez.io/kevinbackground.jpg" alt="A nice keyboard" height="100vh" />
      <Parallax src="https://kevinrodriguez.io/kevinbackground.jpg" alt="A nice keyboard" height="100vh" fixed {/*Disables the parallax effect*/} />
    )
  }
}

License

MIT © kevinrodriguez-io

Dependencies (0)

    Dev Dependencies (27)

    Package Sidebar

    Install

    npm i react-css-parallax

    Weekly Downloads

    2

    Version

    1.1.1

    License

    MIT

    Unpacked Size

    12.4 kB

    Total Files

    6

    Last publish

    Collaborators

    • kevinrodriguez-io