The Vertical Scroll Bar Navigation Method - No Clicking Required.

In this demonstration a list of web pages is provide as a plain text file with one fully qualified URL on each line, each one pointing to an HTML webpage.

In this demonstration there are gray navigation blocks at the top and bottom of the page with instructions and conventional navigational links.

To visit the next page on the list the user need only drag the vertical scroll bar (or turn the thumbwheel) downwards. When the scroll bar reaches its lowest position the appropriate Javascript event is captured and location.href= is used to change the location to the next page on the list.

To access the previous page on the list the user drags the vertical scroll bar to its highest position which triggers a Javascript event to change the location again but this time to the previous URL on the list.

The list is treated as a circular stack so when the last page on the list is being displayed and the signal for the next page is received it loads the first page on the list. Conversely when the first page on the list is being displayed and the previous page signal is received it loads the last page on the list.

Key elements of the Javascript are shown below and the next page on the stack is the vertical scroll bar navigation php script being used in this demonstration. The rest of items on the stack were arbitrarily chosen for the purposes of this demonstration. To return to this page at any time you can also click 'skip to top page'

With browsers that do not correctly implement the min-height style setting this script will not work as described above in those cases where the page to be displayed is not of sufficient height to enable the browser's vertical scroll bar. It should work properly in any case with Firefox versions 1.5 and above.