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.
Script License Agreement
You may use this script only if you agree that:
- You must EITHER:
- Donating Users: This script is "donation-ware". If you can
make a donation to support
this script, it may be used on a website without a crediting link.
Please consider making a donation! I have spent a lot of time developing, debugging and
documenting scripts, and any support is welcome.
More info...
- Free Users: All websites using this script for free must contain somewhere
a visible crediting link to TwinHelix Designs, e.g.
'DHTML / JavaScript Tree by TwinHelix Designs'.
- You must leave the "Script Name/Author/URL" comment in the source of the script file.
- This script is provided on an "AS-IS" basis, without any warranties, and you use it entirely
at your own risk.
- This script may not be redistributed, sold, rented, leased or sublicensed to third parties
without my prior consent.
If you have another use for the script (for example, within a web application) or wish to
arrange alternate licensing terms, please
contact me for more information.
Scrolling:
- Can maintain one or several scrollers on a page.
- Scroll up or down by any amount, or to any pixel position.
- Customisable smooth accelerating/decelerating scrolling speed
- Scroll to <A NAME> anchors within loaded document.
- Go to top or bottom.
- A fully draggable scrollbar thumb...
- ...that represents the size of the scrolled content in its div.
- Minimum/maximum thumb sizes may be set.
- Clicking an empty spot on the scrollbar goes page up/down.
- Keypress scrolling -- example uses A, Z, S, X, T, B and in IE the up/down arrows,
Page Up/Down, and Home/End.
- Mousewheel scrolling support in IE6+, Mozilla, Opera 9+.
- Optional 'Sticky' drag mode, in which the page chases the scrollbar position.
- Positioning engine makes the main div resizable, and can redimension and reposition
any div on the page.
- Events can fire on loading/scrolling for easy extensibility.
- Minimum div sizes can be set as well.
Loading External Content:
- Can parse regular A HREF or A TARGET links to load files into scroller area.
- Or you can use regular JavaScript commands load files into div.
- A URL query or XFRAME hash string to load files is possible e.g.
'divscroll.html#frames(content=file.html,anotherScroller=file2.html)'
- Scroller automatically makes loaded files bookmarkable via that notation.
- Div innerHTML is replaced via an IFrame buffer in IE/NS6+ and layer .load() in NS4.
- No ONLOAD events is required in external files!
- Other divs/layers/images can float over and under this one...
- Can form complete navigational system on one page...
All the instructions are in the source of the DIVSCROLL.HTML file, so load that up and go.
When developing a website using this script, you'll probably want to replace my 'text arrows'
on the scrollbar with some images. I've kept this demo pretty simple with regards to
presentation, so it's easily portable.
If you're stuck, see the ds_help.html file for assistance.
- Added bookmark-scrolling capability, to A NAME="" targets, via the load() routine.
- Added click-parsing to allow standard A HREF or A TARGET links to load files into
scroller area, with no ONCLICKs required.
- Nested the scroller content divs, improving overflow handling (body scrollbars).
- Rearranged script, now object class is at top and functions are added to it later.
- Rewrote events section, now it's in the core script and automatically activates all
scroller objects and backs up preceding events. There's no need to edit it at all now!
- Each div in your array now has a customisable visibility setting, to show it always,
never, or depending on scroller content size (much requested feature :).
- Added W3C XFRAME bookmarkable URI support, updating the older Query Load syntax.
- Fixed background-click detecting when the scroller divs were nested inside another
absolutely positioned div.
- Added 'maxThmHeight' configuration option, so you can have a constant size thumb.
- Put in a nice "sorry" message for older browsers in the content div initially, which will
show in Opera 6 (it can scroll, but can't load files).
- Patch for Opera 7.01+ which throw stupid security errors (7.00 was fine).
- Added "readyState" checking loop in addition to nested IFRAME loading routine, as Safari
doesn't like IFRAMEs much but supports readyState.
- Added a text-selecting fix for IE6 in XHTML documents that contain no body content other
than positioned DIVs.
- Changed the styles on divs a little, coloured a bit and set pointer cursor in Mozilla.
See ds_help.html for a full version history.
Cheers, and good luck - Angus.