DHTML Scroller Engine v3.0

By Angus Turnbull.
Updated: 26 June 2001

Description:

Loads external content into a div, and then can scroll the content in a div vertically within a page using clipping. See my site for compatibility info and updates.

Features built-in:

Scrolling:
Loading External Content:

Limitations:

In IE/NS6, external files are loaded via the innerHTML of the body, meaning that only HTML within the <body> tags is loaded. Basically, it skips the page header, which is no great problem. As a general rule, it is best to keep external files simple - loading framesets etc. is not very practical. Be sure to test out all files loaded in both NS and IE.

NS6, at time of writing, doesn't fire onload events for IFrames which have their content dynamically rewritten. This is a 'known issue' and future versions will solve this problem. However, at present the script gives NS6 five seconds to load a file then displays whatever it's got. As NS6 evolves to a release-worthy state (veiled jab at AOL/NS management :), hopefully it will support the proper loading routine employed in this script. It's also quite slow at scrolling -- hopefully this too will improve one day.

The only other major limitation is in Netscape 4 - this browser cannot resize the page horizontally without going haywire. Instead, the script refreshes the page when the window is resized horizontally - and uses the CGI query mechanism to stay in the same document. So basically, it's the same as a 'back to top' click.

Usage Instructions:

When developing a website using this script, you'll definitely want to replace my 'text arrows' on the scrollbar with some real ones. I've kept this demo pretty simple with regards to presentation, so it's easily portable. Also, you'll want to trim comments out of the HTML code to speed loading times -- there's a handy utility in the ZIP file to assist with this. Please see my site for conditions of use, Frequently Asked Questions if you're stick, compatibility information and updates.

You can load external files, or use content already inside the main div. If you decide to do this, pass an empty string to the setup() function on document loading, and you must hard-code the width into the style property of the main content div, otherwise NS4 doesn't know where to clip it. This bars you from resizing the div with the window, but you can still reposition it.

Version History:

Cheers, and good luck - Gus.