Repeating Table Row Colors

This sample shows to how assign multiple rows colors to a table, regardless of the number of rows in the table.

It is done by first creating the classes that set different background colors.

Then use the Spry Element Selector to assign the classes to the correct row numbers. Read more about nth-child at http://www.w3.org/TR/2001/CR-css3-selectors-20011113/#nth-child-pseudo

This sample has more examples of setting up alternating row colors.

The formula for 'x' number of row colors is:

Spry.$$("table tr:nth-child(xn+(x+1)").addClassName("className");

Static Table

Number Number
1 one
2 two
3 three
4 four

Sortable Spry Table

Name Category
{name} {category}