Jump to content


two CSS Zebra table created from loop

  • Please log in to reply
2 replies to this topic

#1 Meni

  • New Members
  • Pip
  • Newbie
  • 1 posts

Posted 27 July 2006 - 09:09 AM


I have a loop that creates a table from mysql data:

echo '<table border="1" bordercolor="#CFCFCF" align="center">';// a new table for every user...

I have a javascript function that turns this table into a striped table:

<script language="javascript"><!--
function zebraTable() {
    // get the table
    var t = document.getElementById('zebra');

    // set the class name
    var theClass = "evenRow";

    // get a collection of rows
    var rCol = t.rows;

    // declare the counter
    var rowNum = 0;

    // loop through each row
    for (var i = 0; i < rCol.length; i++) {
        // apply the class name
        if (i % 2 == 0) rCol[i].className = theClass;

onload = zebraTable;


This javascrpit will inspect the ID of the table and if it's "zebra" it will stripe it.

All is well untill i want to have two or more tables in one page.

I can't name all of them "zebra" because it will only stripe the first table.

How do i go around this?

#2 ronverdonk

  • Members
  • PipPipPip
  • Advanced Member
  • 277 posts
  • LocationNetherlands

Posted 03 August 2006 - 10:54 PM

Since you are in a PHP forum: where is the PHP in your question?

Ronald  8)
RTFM is an almost extinct art form, it should be subsidized.

#3 AndyB

  • Staff Alumni
  • Advanced Member
  • 5,465 posts
  • LocationToronto

Posted 04 August 2006 - 12:51 AM

Since this isn't a php question and the solution I'll point you to is a CSS solution not javascript, I'll move this to the CSS forum after posting the link to what is likely the best solution:

Legend has it that reading the manual never killed anyone.
My site

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users