SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Evangelist
    Join Date
    Dec 2000
    Posts
    528
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    More Efficient Way Of Changing Colors Per Row?

    Hey all,

    I just read "JavaScript 101 - Part 1," and had a question about the specific part linked to above:

    Is there a more efficient way of switching colors every row other than calling it every time you want to start a new row? Also, how can the row number be increased each time if the variable rownumber is only increased by one within the second half of the function? What if the row is even? Is the number not increased?

    I'm a newbie at JavaScript, so please provide code and explanation.

    Code can be found here: http://www.webmasterbase.com/example...ablecolour.htm

    Thanks,
    -Corbb
    Corbb O'Connor
    Looking for quality website design or database programming?
    Contact me for more information and a FREE quote!

  2. #2
    Currently Occupied; Till Sunda Andrew-J2000's Avatar
    Join Date
    Aug 2001
    Location
    London
    Posts
    2,475
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    heres something which works nicely. Hopefully the comments, which i added should help you

    PHP Code:
    <table border="1" cellpadding="2" cellspacing="0" id="stripe">
      <
    tr>
        <
    th>header 1</th>
        <
    th>header 2</th>
        <
    th>header 3</th>
        <
    th>header 4</th>
        <
    th>header 5</th>
      </
    tr>
      <
    tr>
        <
    td>1</td><td>2</td><td>3</td><td>4</td><td>5</td>
      </
    tr>
      <
    tr>
        <
    td>1</td><td>2</td><td>3</td><td>4</td><td>5</td>
      </
    tr>
      <
    tr>
        <
    td>1</td><td>2</td><td>3</td><td>4</td><td>5</td>
      </
    tr>
      <
    tr>
        <
    td>1</td><td>2</td><td>3</td><td>4</td><td>5</td>
      </
    tr>
      <
    tr>
        <
    td>1</td><td>2</td><td>3</td><td>4</td><td>5</td>
      </
    tr>
      <
    tr>
        <
    td>1</td><td>2</td><td>3</td><td>4</td><td>5</td>
      </
    tr>
    </
    table>

    <
    script type="text/javascript">

      var 
    document.getElementById('stripe').childNodes[0].childNodes;
      
    //        get element table(by id stripe). get element tbody(by child).  get children of tbody(tr tags)

      
    var len r.length // - total number of tr tags belonging to the tbody tag

      
    for (i=0;i<len;i++) //counts upwards to the total of len (tr tags)
      
    {
        (
    i%== 0)?null:r[i].style.backgroundColor='orange';

        
    // % means modulus, gets the remainder of dividing a integer
        // if (i%2 == 0)  null else r[i].style.backgroundColor='orange';
      
    }
    </script> 

  3. #3
    SitePoint Evangelist
    Join Date
    Dec 2000
    Posts
    528
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Andrew,

    Thanks a lot!

    -Corbb
    Corbb O'Connor
    Looking for quality website design or database programming?
    Contact me for more information and a FREE quote!


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •