falconer-parallax

A lightweight plugin for parallax


Keywords
Parallax, JavaScript
License
ISC
Install
npm install falconer-parallax@1.0.2

Documentation

Hi there, thank you for using Falconer Parallax.

USING ATTRIBUTES

The plugin works with a container element and child image elements. The container html element (for example, the body tag) needs the following attribute:

data-component="Parallax"

All image elements within that container will have parallax applied to them. If you want to specify a particular constraint or scale for one of the images, give the image tag the following example attribute:

data-options="constraint:3,scale:3"

These options must be passed in as a string, in key:value pairs, in a comma separated list. The value 'constraint' will decrease the speed with which the image slides up, so a higher value here means a slower animation. The value 'scale' increases the size of the image.

STYLING

This plugin has been developed with fixed-position elements in mind. However, feel free to experiment with other positioning styles.