jQuery Example: Zebra Tables (Striping)

I’m working on putting some of my most often used jQuery snippets onto SKFox.com. Here is my first such attempt. Table striping makes data easier to read and jQuery has some great selectors for this.

$(”table.zebra thead > tr:first-child()”).addClass(”zSelected”);
$(”table.zebra tbody > tr:nth-child(odd)”).addClass(”zOdd”);
$(”table.zebra tbody > tr:nth-child(even)”).addClass(”zEven”);

Be sure to check out the table striping demo page and view the source to see the small amount of CSS and javascript it takes to make your tables pop for your users.

More to come over the next few weeks…

2 Comments

  1. Blender says:

    Is it possible to print the pages with striping?

  2. Blender says:

    When you print the table the striping is lost.
    Is it possible to print with the applied classes?

Leave a Reply