What it is
Adds parallax effect to images and videos.
Installation
parallaxy.js is available as an npm package.
npm install parallaxy --save
Add parallaxy.min.js to the bottom of the <body> like this:
<script src="parallaxy.min.js"></script>
Note
This is an very early version of parallaxy.
How to Use
Usage
In this example the image will have a parallaxy effect.
Content above After DOM change
If the DOM has changed and you want to reset Parallaxy, just run;
Parallaxy.refresh();
Options
Options must be passed via data-attributes. Append the option name to data-parallaxy-, as in data-parallaxy-speed="0.25".
| Name | Type | Default | Description |
|---|---|---|---|
| speed | Float | 0.5 | Adjust parallaxy effect from 0-1 (none-max) |
| ignore | Boolean | false | Ignore parallaxy effect on this element |
Global options (data-attribute):
| Name | Type | Default | Description |
|---|---|---|---|
| ignoresmoothscroll | Boolean | null | Ignore smoothMouseWheel. Place anywhere |
Browser Support
Coming soon. Uses CSS translate2D to scale and position images.
License
The code is available under the MIT License.