This works for the <thead>. You can apply the same principle to the
<tfoot>:
$('th').each(function(index) {
$(this).hover(function() {
$('td:nth-child(' + (index+1) +')').css('background', '#ffc');
}, function() {
$('td:nth-child(' + (index+1) +')').css('background', '#fff');
});
});
I only used .css() to run a quick test. You'll probably want to
change those two to .addClass('some-class') and .removeClass('some-
class')
--Karl
_________________
Karl Swedberg
www.englishrules.com
www.learningjquery.com
On Feb 9, 2007, at 8:27 AM, Mark Harwood wrote:
Im trying to figure out how i could go about highlighting table cells
that are grouped vertically when you hover over the THEAD element
or the
TFOOT element.
Im not sure how i should grab them via jQuery though.
Say we have a table like
<table>
<thead>
<tr>
<th>People</th> <--// Hove over this //->
<th>Ages</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<tr>
<td>John</td> <--// Highlight this //->
<td>68</td>
<td>none</td>
</tr>
<tr>
<td>Joe</td> <--// Highlight this //->
<td>99</td>
<td>none</td>
</tr>
<tr>
<td>Mary</td> <--// Highlight this //->
<td>72</td>
<td>none</td>
</tr>
</tbody>
</table>
Any ideas? it would need to select all the TD directly below it, or
above it if we was highlighting a TFOOT element
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
