slickscrolljs
v2.0.2
Published
Lightweight JavaScript library for smooth momentum scrolling and adding scroll based parallax effects
Downloads
330
Maintainers
Readme
Slickscroll is a JavaScript library that makes momentum & parallax scrolling quick and painless
View Demo: slickscroll.musabhassan.com
Download & Setup
Download
Manually download from Releases, from the dist
directory, or npm.
npm
npm install --save slickscrolljs
Setup
This setup will just apply momentum scrolling to the body
ES6 import
import slickScroll from './slickscroll.es.min.js';
const slick = new slickScroll({
root: "body"
});
HTML script tag
<script src="./slickscroll.min.js" type="text/javascript"></script>
<script type="text/javascript">
let slick = new slickScroll.default({
root: "body"
});
</script>
Node require
const slickScroll = require('slickscrolljs');
const slick = new slickScroll.default({
root: "body"
});
Hello World
The hello world will apply the momentum scrolling to the element you specify.
slick.momentumScroll({
root: "body"
})
The overflow property of the root
element will be overridden with auto
upon initialization of slickscroll. If you wish to change overflow to anything else, you must modify it after the initialization.
Momentum scrolling applies to both x and y axis of an element. If you wish for an axis to not scroll, change it's overflow value to hidden
after slickscroll initialization.
Example to hide overflow-x after initializing up slickscroll;
const slick = new slickScroll.default({
root: "body"
});
document.body.style.overflowX = "hidden";
All the valid options aswell as documentation and Getting Started can be found in the docs
directory.
Browser Support
Browser | Version | - | - | Chrome | 61+ Edge | 80+ IE | 11 Firefox | 48+ Opera | 48+ Safari | 12+
Contributors
Musab-Hassan
License
MIT license.