Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Alternating table row color, but with 2 rows of data

Tags:

jquery

css

I've got my table setup for Zebra striping, but how do I accomplish making the row color alternate for 2 rows instead of a single row?

My data markup looks like this:

<tr>
        <td>@task.TaskNum</td>
            <td>@task.RepiarTime</td>
            <td>Priority Club</td>
            <td>SD</td>
            <td>Commercial</td>
            <td>Reg Commercial</td>
            <td>After Hours</td>
        </tr>
        <tr><td colspan="7">
                @task.Description.ToString()
            </td></tr>

I am using this to stripe it:

    $(document).ready(function () {
    $(".stripeMe tr").mouseover(function () { $(this).addClass("over"); }).mouseout(function () { $(this).removeClass("over"); });
    $(".stripeMe tr:even").addClass("alt");
});
like image 248
PixelMuse Avatar asked Mar 20 '12 20:03

PixelMuse


1 Answers

Something like this should work:

$(".stripeMe tr").each(function(i){
    if (i%4 < 2){
        $(this).addClass("alt");
    }
});
like image 50
Kai Sternad Avatar answered Nov 15 '22 10:11

Kai Sternad