Robert Denton

Staggering work of genius from Portland, Maine – Gardener, Photographer, Designer, Taco Maker, Birder, Biker, Wine Merchant

Table Striper

Dom manipulation of a table — make mine striped please.

The code below goes in the head of your document. All you need to do next is tag your table with an id=”something” and add an onload trigger to your body tag.

<script language="JavaScript" type="text/javascript">

  var TABLE_ROW_COLOR_DEFAULT = "#FFFFFF";
  var TABLE_ROW_COLOR_HILIGHT = "#CCCCCC";

  function stripeTableRows(tableObject,startRow) {
           var currentRowColor = "";
       for (var i = startRow; i < tableObject.rows.length; i++) {

                        currentRowColor = TABLE_ROW_COLOR_DEFAULT;

                      if (i % 2 == 0) {
                            currentRowColor = TABLE_ROW_COLOR_HILIGHT;
                 }

                 tableObject.rows[i].style.backgroundColor = currentRowColor;

       }

  }

  function configurePage() {
    stripeTableRows(document.getElementById("calTable"),0);
  }

To do:

  • make colors a passed variable
  • widgetize the thing into a common library
  • come up with structure for said common library, w/re to access in each file, etc…
Posted: 08.03.2004 in DesignTagged , Both comments and pings are currently closed. — RSS 2.0

Comments are closed.