JavaScript & HTML Tips
 
Feature highlight:Using a Scrolling Grid or Table with JavaScript
Credit:
Guyon Roche at WebReference.com

Description
A table or grid component has been late to show up in JavaScript because HTML's tables proved more than adequate. But with screen real estate always being at a premium - there is the need to be able to store data in a grid that allows both horizontal and vertical scrolling. That is what is available here thanks to Webreference.com and Guyon Roche.

The trick is to transfer your data into a JavaScript array and then let this Grid JavaScript component do the work for you:
Full scrolling grid example.
NB: The values in this table bear no relation to any currency, real or imaginary.

The chief advantage of a scrolling grid like this is the screen real estate it saves. Now some may ask - what value is that ? Well as a webmaster let me tell you that items in the top third of a web page get at least 50% more viewing/hits than items below the first scroll line (i.e just out of view in the web browser so that the user has to scroll the page down). So being able to bring meaningful data and tables to viewers attention as this Grid Table does is quite useful indeed. Click here if you disagree with such a fuddy duddy notion as a scroll line.

 
Top of Page  Tutorials Home  Javascript References  JavaScript Books