Tables with resizable columns.

Author: Aleksandras Novikovas
an@systemtier.com

Here is JavaScript functionality which allows to resize HTML table columns.

Table MUST have id property and header (THEAD and TH) elements.
To make table resizable you must execute:
<script type="text/javascript">installTable ("valueOfTableIdPropery");</script>
AFTER table is rendered.
On successful setup function installTable adds special marker ("|") to each column header element, sets onmousedown prperty to each marker and onmouseup and onmousemove properties for whole document body.
You can drag this marker to resize column.
Marker can be edited by changing value of markerHTML variable.
Minimum column width can be set by changing value of minWidth variable.
This functionality is tested on IE and FireFox.

Header 1 Header 2 Header 3 Header 4
colmn 1 row 1 colmn 2 row 1 colmn 3 row 1 colmn 4 row 1
colmn 1 row 2 colmn 2 row 2 colmn 3 row 2 colmn 4 row 2
colmn 1 row 3 colmn 2 row 3 colmn 3 row 3 colmn 4 row 3
colmn 1 row 4 colmn 2 row 4 colmn 3 row 4 colmn 4 row 4
colmn 1 row 5 colmn 2 row 5 colmn 3 row 5 colmn 4 row 5

Header 1 Header 2 Header 3
colmn 1 row 1 colmn 2 row 1 colmn 3 row 1
colmn 1 row 2 colmn 2 row 2 colmn 3 row 2
colmn 1 row 3 colmn 2 row 3 colmn 3 row 3
colmn 1 row 4 colmn 2 row 4 colmn 3 row 4