02 Sep
Posted by Ray Cheung as Information, License Free
jParallax turns a selected element into a ‘window’, or viewport, and all its children into absolutely positioned layers that can be seen through the viewport. These layers move in response to the mouse, and, depending on their dimensions, they move by different amounts, in a parallaxy kind of way. If the layers are made of <div>s or <li>s or any other container then content can be positioned inside those layers, and Parallax provides methods for navigating to that content in response to user events.
The default behaviour of jParallax is to show the whole width of a layer in response to the mouse travelling the whole width of a jParallaxed element. The simplest way to use jParallax is to make the layers different sizes using CSS. Bigger layers move faster and thus appear closer, and unless a layer is smaller than the viewport, its edges are never seen.
Requirements: -
Demo: http://webdev.stephband.info/parallax.html
License: License Free





Nice tool for on-line portfolio! I must try it!
That is seriously cool. And a great treat for clients that want flashy glitter on their home page, so I can talk them out of Flash.
That’s pretty awesome! Already made use of it. Check my website. This tool has so many potential uses… Thanks!
Ke Barbaridad!!!
It’s so cool, i’ll try to use it with my imgs
Its pretty cool! I love the last example
but frankly I cannot think of any useful use for this tool!
lol
Hey, cool – thanks for this one!
Well, not a huge jQ fan but this… This is pretty wicked! Need to port it to MooTools!
Nicely done, there’s another jQuery parallax plugin floating around out there too that’s worth a look. Google “jQuery parallax” and it comes up.
Good stuff.
RSS feed for comments on this post · TrackBack URI