How to use parallax

scroll.md

Example: https://github.com/jzntam/fundamentals-dec-2014-exam/blob/master/views/cool.erb

Place parallax.min.js into the app/assets/javascripts

In the view you are working on...

Because we are using rails, you must use the <%= asset_path 'whatever-image.jpg' %> tag when you are in an element.

<div class="parallax-window" data-parallax="scroll" data-image-src="<%= asset_path 'image.jpg' %>">
  <div class="hello-container">
    <p>content....</p>
  </div>
</div>

Add application.scss

.hello-container {
  height: 600px;
  position: relative;
  margin: 0 auto;
}

Add it in again but with a different image...

<div class="parallax-window" data-parallax="scroll" data-image-src="<%= asset_path 'someotherimage.jpg' %>">
  <div class="hello-container">
    <p>content....</p>
  </div>
</div>

ALL DONE! you can play around with the window sizes as well to change the effects.

MOAR options here http://pixelcog.github.io/parallax.js/