1.0.2 • Published 4 years ago
smooth-parallax.js v1.0.2
smooth-parallax.js
Lightweight lib for smooth parallax image scroll effect, written in vanilla JS with no dependencies.
Usage
Install
$ npm install smooth-parallax.js
Example
To make it works your img
element needs to be wrapped.
<div id="wrapper-id">
<img src="path-to-your-image.jpg" alt="Some awesome image">
</div>
Then import SmoothParallax
into your js file.
import SmoothParallax from 'smooth-parallax.js';
const parallax = new SmoothParallax(document.getElementByID('wrapper-id'));
Options
There are the two options that you can edit, such as:
const parallax = new SmoothParallax(element, {
speed: 10,
scale: 1.2,
});
speed
- speed of image translation under the wrapper. Default value forspeed
is 10. Please adapt the speed of translation according to your element size.scale
- in order to translate your image, it needs to be slightly bigger than wrapper. So with scale we make sure that your image overlaps behind wrapper. Default value forscale
is 1.2
Licence
Licensed under the MIT license.