jQuery/JavaScript Java VBA

Colorize is a jQuery plugin to add background color to alternate HTML table rows, highlight a row/column on mouse over, and colorize a row/column when you click your mouse button over it. You can colorize as many table rows or columns as you want. A repeat mouse click reverts the row/column to the original background color.

How to use it?
Use it with default options (colorizes a row)
$('#yourTableId').colorize() ;

Optional parameters:

altColor : alternate row background color. The default is '#ECF6FC', 'none' can be used for no alternate background color.
bgColor : background color (The default background color is white).
hoverColor : background color when you hover a mouse over a row. The default is '#BCD4EC'.
hoverClass: style class for mouseover; takes precedence over hoverColor property
hiliteColor : row highlight color. The default color is 'yellow'. 'none' can be used to disable highlighting.
hiliteClass : style class to be used to highlight a row or a column, takes precedence over the hiliteColor setting.
columns : deprecated in the latest version. Use click and hover options instead.
hover - sets mouseover features. Available values are as follows: 'row','column', 'cross'. The default value is 'row'.
click - sets highlight options on mouse click. Available values are : 'row','column', 'cross'. When a 'row' value is set, a row is highlighted on click; when a 'column' value is set, a column is highlighted on click. The 'cross' value allows to highlight both rows and columns at the same time. The 'row' value is the default.
oneClick : true/false - Allows only one row or column to be highlighted at a time. A click on a new row/column cancels the current highlight. The default is false.
banColumns :[]- Prevents certain columns from being highlighted when clicked, and also on mouseover. Supply an array of column indices as an argument. A value of 'last' can be used to ban the last column.
banRows::[]- Prevents rows from beign highlighted. Supply an array of column indices as an argument.
banDataClick :true/false - If true, you can only click on table header rows. The default is false.
ignoreHeaders :true/false - If true, header rows are not colorized. (no striping). The default is true.
nested :true/false . The default is false. Use it for more consistent striping if a table contains nested tables.

Examples:
The order of parameters is not important.
$('#yourTableId').colorize({bgColor:'#EAF6CC', hoverColor:'green', hiliteColor:'red'});
$('#yourTableId').colorize({ oneClick:true});
$('#yourTableId').colorize({hover='column', click='column', banColumns :[0,1]});
$('#yourTableId').colorize({hover='cross', click='column'});
$('#yourTableId').colorize({ hiliteClass:'myStyle'});

No highlighting:
$('#yourTableId').colorize( { hiliteColor:'none' } );

Demo 1 - Usage with default options: $('#tblId').colorize();

Demo 2 - Highlights columns, one column at at time. Usage : $('#tblId').colorize( {columns: true, oneClick:true} );

Download Colorize 2.0.0 plugin

Download version 1.6.0

Download version 1.5.1

Download version 1.4.0

Download version 1.3.1

Download version 1.2.1

Download version 1.1

Version History

Version 2.0.0introduces 3 new options. The first new option is hover - to set mouseover features. Available values are as follows: 'row','column', 'cross'. The second option is click - to set highlight options on mouse click. Available values are the same as for the hover option: 'row','column', 'cross'. The values are self-explanatory: when a 'row' value is set, a row is highlighted on mouseover or click; when a 'column' value is set, a column is highlighted on mouseover or click. The 'cross' value allows to highlight both rows and columns at the same time. The 'row' value is the default.
The third new option is banRows. It allows you to set an array of row indices that will not be highlighted on mouseover or click when a 'column' value is selected. Usage: banRows:[1,2].
The columns option is deprecated. Use the click and hover options instead.

Version 1.6.0 introduces 3 new options, and a new feature. The new feature lets you highlight rows on mouseover and colorize columns on click. Use columns:'rowHover' option to enable this feature. New options: banDataClick - disables clicking cells, allowing only header row click; ignoreHeaders for striping; nested if you have nested tables.
Also, for better jQuery compatibility, the jQuery bind event is used to bind the onclick event handler to table cells.

Version 1.5.1 fixed a bug that caused a failure to highlight a row/column when clicking more than 2 times on the same row or column. (thanks to code from an anonymous user)

Version 1.5.0 introduced a new option, hoverClass, to indicate a style class to be used for hovering (thanks to a an idea from snobo). (Please be aware that the use of this option may degrade IE performance).
The altColor supports the value of 'none' now.
The columns option has a new value: 'hover' - changes columns background color or style on mouseover, but assigns a new style or background color to rows when they are clicked.
Includes support for multi-level headers by highlighting only the last header row. (However, the 'last' option does not work with multi-level headers)
In the banColumns option, a value of 'last' can be used to ban the last column.

Version 1.4.0 introduced a new option, hiliteClass, to indicate a style class to be used for highlighting (thanks to a tip from Skye Giordano). Also, the banColumns option now suppresses not only highlighting but also hover.

Version 1.3.0 allows to use the banColumns option even if the columns parameter is false (thanks to the code contributed by Aymeric Augustin)

Version 1.2.1 introduced a new feature : disable highlighting (thanks to a user comment):
Use 'none' value for hiliteColor option if you want to disable highlighting

Version 1.2.0 introduced new options :
columns : true/false
oneClick : true/false
banColumns :[]

Version 1.1.0 fixed a bug in the original version that highlighted all the tables on a page.