jquery vertical scroll / background offset

Hi -

I’m looking for a jQuery / html5 plugin that will create an depth of field effect - so the background image scrolls slower than the foreground content / images.

The background image could even be positioned with css - then maybe a foreground image and a foreground content block would scroll over at slightly different speeds when a user scrolled down the page.

I’m not quite sure of the terminology - maybe spatial visualization? -

Anyway - the resultant page would be pretty long but give the user / content a perception of depth on the page.

Any ideas of where to look / create such an effect?

Many Thanks,


The effect is called - “Parallax”.

There is a jquery plugin that creates this effect on a bunch of layered images, and is called jParallax - http://webdev.stephband.info/parallax.html

But I see that your requirement is parallax effect while vertically scrolling the page. For that I found this plugin called “Scrolling Parallax” - http://jonraasch.com/blog/scrolling-parallax-jquery-plugin

I think it would suit your project quite well.

I love this forum :slight_smile:

Thanks Cosmocoder!

You are welcome. Glad to be of help :slight_smile: