jquery scrolling effect approach(scrollpoints, horizontal scroll “hijack”)

Question

Probably not the best title, but what I'm looking for is the best approach to create a site with effect similar to this http://www.mdot.it/ "hijacked" vertical scrolling.

Basically I'd know how to do it were it only scrolling down(i.e. if scroll position is 100, fade something out, set something to fixed etc), what I can't get my head around is how to make it work both directions unless I'd use some crazy conditions and stuff.

Can't find the right word to call this effect either, everything I searched for resulted in paralax plugins..

Any tips/patterns/links that would help me?

Thanks!

// edit what mdot is doing is split the whole page into frames(1px 1 frame) and then assign styles for all 52 elements to each frame, so every scrolled pixel there is 52 styles being set.. there has to be a better way, or?

Answer 1

Maybe skrollr is what you want. It's very lightweight and doesn't get in your way.

Answer 2

I was able to dig up http://johnpolacek.github.com/scrolldeck.js/ on google, one of the examples has animations which work in both directions and it looks relatively well thought through - should be a good start.

Answer 3

Check the cool scrollpath by Joel Besada:

https://github.com/JoelBesada/scrollpath

Demo here