Rellax is a buttery smooth, super lightweight (871bytes gzipped), vanilla javascript parallax library. Rellax limits the parallax feature to laptop/desktop screens since the effect is negligible on smaller screens.
Have any suggestions or feedback? Reach out @dixonandmoe
npm install rellax --save
or if you're old school like us download and insert rellax.min.js
<div class="rellax">
I’m that default chill speed of "-2"
</div>
<div class="rellax" data-rellax-speed="7">
I’m super fast!!
</div>
<div class="rellax" data-rellax-speed="-4">
I’m extra slow and smooth
</div>
<script src="rellax.min.js"></script>
<script>
// Accepts any class name
var rellax = new Rellax('.rellax');
</script>
<script>
// Also can pass in optional settings block
var rellax = new Rellax('.rellax', {speed: -4})
</script>
In the spirit of lightweight javascript, the build processes (thus far) is lightweight also.
- Open demo.html
- Make code changes and refresh browser
- Once feature is finished or bug fixed, use jshint to lint code
- Fix lint issues then use Google Closure Compiler to minify
- 🍻