Posted By

bradless on 02/11/10


Tagged

jquery background row color zebra alternate striping


Versions (?)

Who likes this?

8 people have marked this snippet as a favorite

codex
alejandrosuch
jfherring
charlesp1138
Kurt
wirenaught
scilec
miguelcanijo


Alternate Row Colors / Zebra Striping with jQuery


 / Published in: jQuery
 

  1. // jQuery
  2. $(function(){
  3. $("tr.stripe:even").css("background-color", "#D0D0D0");
  4. $("tr.stripe:odd").css("background-color", "#E5E5E5");
  5. }
  6.  
  7.  
  8. // HTML
  9. <table>
  10. <tr class="stripe">
  11. <td>Col 1</td>
  12. <td>Col 2</td>
  13. <td>Col 3</td>
  14. </tr>
  15. <tr class="stripe">
  16. <td>Col 1</td>
  17. <td>Col 2</td>
  18. <td>Col 3</td>
  19. </tr>
  20. <tr class="stripe">
  21. <td>Col 1</td>
  22. <td>Col 2</td>
  23. <td>Col 3</td>
  24. </tr>
  25. </table>

Report this snippet  

You need to login to post a comment.