Archive
Tablesorter alternative coloring problem and solution
The problem:
When trying to combine zebra effect (alternative row colors) and row-hover highlight effect, only the even rows shows the highlight effect.
The (original code):
$(function() {
$("#tablesorter-demo").tablesorter({sortList:[[0,0],[2,1]], widgets: ['zebra'] });
});
/*style.css*/
table.tablesorter tbody tr.odd td {
background-color:#F0F0F6;
}
table.tablesorter tr:hover td {
background-color: #632a2a;
color: #fff;
}
The fix:
/*style.css*/
table.tablesorter tbody tr.odd td {
background-color:#F0F0F6;
}
table.tablesorter tr.odd:hover td, table.tablesorter tr:hover td {
background-color: #632a2a;
color: #fff;
}
Other thought:
The highlight effect has not been tested in IE6 yet, might need to use js to achieve the same effect.