Custom scroll bar behavior in Javascript?

Question

I'd like to reproduce an effect similar to this page: http://artofflightmovie.com/ where the vertical scrollbar controls the progression of the browser "viewport" over a pre-defined path.

I am thinking the easiest way of going about this is through the use of javascript to read the scroll bar value and position background elements accordingly.

Is it possible to obtain the vertical scroll bar value in Javascript? Am I approaching this design wrong?

Answer 1

Is it possible to obtain the vertical scroll bar value in Javascript?

var scrollTop = document.documentElement.scrollTop || window.pageYOffset;

Am I approaching this design wrong?

It seems like a valid approach.

Answer 2

I would think that you'd want to:

1. Create an element with the desired scrollbar
2. Hook up an event handler for scroll events
3. Write logic in that event handler for how you guide your main page depending upon the scroll position you get in the event handler