jQuery Plugin To Create Parallax Effects On Page Scroll - parallaxed.js

parallaxed.js is an ultra-light jQuery plugin for applying smooth parallax effects to given elements on vertical or horizontal page scrolling.

How to use it:

1. Include jQuery library and the jQuery parallaxed.js script on the webpage.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="src/parallaxed.js"></script>

2. Use the data-parallaxed-speed attribute to specify the different scrolling speeds for your parallax elements.

<div class="parallax"
     data-parallaxed-speed="1.5">  
  ...
</div>

<div class="parallax"
     data-parallaxed-speed=".5">  
  ...
</div>

<div class="parallax"
     data-parallaxed-speed=".8">  
  ...
</div>

3. Enable the parallax scrolling effect on the elements.

$('.parallax').parallaxed();

4. All the options can be passed via data-* attribute on elements or via 'option' object during initialization.

$('.parallax').parallaxed({

  // use CSS transform
  usetransform: true,

  // scrolling speed
  speed: 1,

  // When parallax scrolling should start
  // visible, offset or always
  start: 'visible',

  // The offset parallax scrolling should start at 
  startoffsettop: 0,
  startoffsetleft: 0
  
});

---

This awesome jQuery plugin is developed by smashed-potatoes. For more Advanced Usages, please check the demo page or visit the official website.