Parallax effect

2009-12-23

So after seeing Román Cortés' parallax effect in pure HTML+CSS I thought to myself, that'd be easy in Javascript. So I made it my Xmas project. Turns out the project didn't last till Xmas. But I had fun anyways :)

A parallax effect is an effect where there are multiple layers which move independently from eachother at different speeds. The front moves faster than the back. This gives it a 3D feeling, because that's what happens in real life. Stuff in the front moves faster than the back.

So I had all kinds of ideas to make this usefull. When implementing it (not using Román's explanation by the way, it was quite clear how to do this) those idea's didn't seem to be so cool anymore. So I left it at a few examples.

The main example/live demo can be found here (not very IE friendly..). And some more.

Note that the source of the main example is "as it should be" (clean and documented), the other versions are just snapshots during development which are stable but look different.

Feel free to use it. It makes use of my CDE library and I think it can be easily changed to make cool stuff with.

Hope it helps ya :)