For the viewport, you need to use document.documentElement.scrollTop / scrollLeft / scrollHeight / scrollWidth . There is a slight complication: I think in quirks mode ( document.compatMode is "BackCompat" ) you need to check these properties on document.body instead of document.documentElement .
See https://developer.mozilla.org/en/DOM/element.scrollTop for documentation.
Change It seems that you are not interested in the viewport, but rather its contents. AFAIK, there is no general way to retrieve the contents of a specific area of a web page. It is definitely not possible to describe with a single Range object, rather than a set of ranges. And even then: if the element has a lot of text, and all this is one TextNode , you will not know which parts of the text are visible and which are not.
However, in some special cases (especially when the page structure is simple), you can find out what text is displayed using range.getBoundingClientRect () . First, you select everything in your range and reduce this selection until the size of the range falls within the borders of the viewport.
Here is an example that does this for a vertically scrollable <div> that contains a lot of text: http://jsfiddle.net/5vEdP/ (tested on Firefox 6, Chrome 14, and IE 9). First you need to make sure that each text character is placed in its own TextNode , otherwise you cannot select it separately in the Range object. He then selects the text container and moves the beginning of the range until the top of the range is below the top of the container. And then he does the same for the lower border, moving the end of the range. At the end, you get a range that displays only text nodes that are fully visible.
source share