I want to convert this css behaviour into a jquery hover statement (because IE7/8 doesn't support css3). Basically when hovering over a row, I want the whole row to be highlighted except for the last cell.
#mysearchtable tr:hover td:not(:last-child)
{
background-color: #444444;
}
I've tried using this:
$("#mysearchtable tr td:not(:last-child)").hover(
function () { $(this).addClass('hoverclass') },
function () { $(this).removeClass('hoverclass') });
The problem with this is $(this) is only returning the actual cell that was hovered over. I can try and use $(this).parent() but that would give me the whole row. What I want is the highlight the whole row, except the last cell.
Would anyone know a solution?
Cheers.
Untested, but try:
$("#mysearchtable tr").hover(
function () { $(this).find("td:not(:last-child)").addClass('hoverclass') },
function () { $(this).find("td:not(:last-child)").removeClass('hoverclass') }
);
Here you can use this way. Jsfiddle demo
$("table td").not('td:last').hover(function() {
$(this).css('background-color','red');
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.