Scrolling Menus extension

The Scrolling Menus extension adds stylish, animated scrolling behavior to overlong menus, so they can contain more links than would otherwise be possible. It ensures that the menus remain useable even in very small windows, and allows you to design for an unknown number of links within a single menu.

Any end-of-branch menus which are taller than the window, or a set maximum height, will have mouseover-driven buttons to scroll the content up and down. The scrolling starts fairly slowly, then accelerates until it reaches a set maximum speed. You can also click the buttons to toggle between slow and fast scrolling.

When navigating with the keyboard, the menus will auto-scroll in response to focus events, so that the highlighted link remains close to the center of the scrolling region. The scroll buttons will still appear, serving to indicate the presence of content below the fold.

This extension is not supported in Opera < 7.5 (because of a now-fixed problem with its implementation of clip), or in Mac/IE5 (because of rendering problems for which I couldn't find efficient workarounds). It's only partly supported in Win/IE5.0 - animated clip-based scrolling is not stable in that browser, but it can use regular overflow:scroll.

Whether or not to let the menus show anyway is up to you, and will depend upon how you're using it. In this demo I've chosen not to show the menus to unsupported browsers, but to allow the use of overflow:scroll for Win/IE5.0.