Dynamic Guru - The Web and Technology Blog


ajax css design featured freebies google html internet javascript jquery php seo technology tools web wordpress wordpress themes xhtml
 
Posts tagged with —zebra strip effect

jQuery : How to highlight alternate rows of a table

While displaying large chunks of data in a table with lots of rows, it is really desireable to have a different background color for alternating rows. While there is no easy way you can do that using css alone, it is highly impractical to manually add a alt class to each alternate tr (table row). But thanks to the powerful selector engine of jQuery, you can very easily select an alternate tr . Here is how :

$("#mytable tr:odd").addClass("alt");

The above code selects every odd table row of the table with id mytable and adds a class alt to each of theme. Next you can style the alt class rows (tr) using css to make them stand out and add a nice zebra strip effect to your table.

© 2012 Dynamic Guru All rights reserved - About Us - WordPress themes - Mujtaba Ahmad