We've gotten tons of email from folks wanting to emulate the image changes that occur in alternate panes from the pane now active. Many cited a page at Netscape® that they really liked but were unable to replicate the code.

So we cobbled together this demo page for a mythical web site to give you the necessary snippets to put this sort of display on your own site. Just substitute your own icons and colors and messages in the predefined arrays to tailor it to your own site.

How it works:

When the visitor passes his/her cursor over the links in the left navigation frame, the buttons "light" while simultaneously the content of the main frame changes to give a "preview" of what the content is on the specified page without the requirement to "click" on the link. Simultaneously, the icon image in the upper left frame is changed to correspond more or less to the link content. These icons were found at Wyatt Lehmenkuler's great A+ Art clip art, icons, and much more site.

Note: Just for this demonstration, if you click on any of the links in the navigation frame, not only will you get to see the stunning "squishy" buttons, but you'll just get an alert message. To link your pages just add the urls to the array in the leftpn.htm file. Then modify the function dumpIt1(flg) as instructed in the source to activate the links.

Test drive the demo.

GRAB THE SCRIPT: Just download the following compressed file. It contains all the files you need.

icons.zip (35k)