GuruBlog

in one of my recent projects i needed to highlight a table row and column of a html table on mouseover.

i found out that it's quite simple to do in jquery - even without a plugin.

first you have to find out in which column your mouse pointer currently is.

var idx = $(this).parent().children('td,th').index( $(this))+1;

and then you mark all the td's and th's in the table with the same column index

$('td:nth-child('+idx+')').addClass( 'hover' );
$('th:nth-child('+idx+')').addClass( 'hover' );

click here to download a simple example project.