Javascript to determine where the user is on the page.

Question

When you view a long thread in gmail a div appears at the bottom of the screen showing the name of the author of the next message. As you scroll and view more messages this div gets updated, always with the name of the author of the message which is after the message you are viewing.

How do you think this feature is implemented?

I have a long page with log information and I'd like to remind the user where they are on the page. I've tried looking at the gmail javascript, but the code is too obfuscated to follow.

Answer 1

Using jQuery you could get the height of everything, and then calculate it this way, based on the current scroll position.

Alternatively, you could make it such that they need to 'click' on the thing they are looking at, and then do it via onfocus.

Answer 2

You need to get the current scroll offset. That determines how far down the page the user is.

You need to know what element is at this offset. The position of elements is calculated using their offset of each parent element from each other.

Usually, a library such as JQuery, MooTools, YUI etc. have existing methods to get scroll position and element positions.