Question

I’d like to have a function that will highlight row of the table when a mouse rolls over it. I currently have a function that creates an alternate row color every other row and I would like to modify it rather than creating a separate function. Here’s what I have:

$(".tblRows tr:even").addClass("altColor");

where

.altColor TD {
background-color:#f5f5f5
}

and my HTML is

<table class="tblRows">
...

I know there’s a jQuery function hover() but I’m not sure how to incorporate it with what I’ve got. When hovered I’d like it to use class=”hilite”

Is it possible?

Answer 1

Is there a reason you don’t just use CSS for this?

#myTable tr:hover {
    background: orange;
}

Won’t work on a <tr> in IE6, but will work elsewhere.

Example: http://jsfiddle.net/auWGU/