coding_beginner
coding_beginner

Reputation: 67

alternating row colours with 3 different background

Instead of 2 rows, which i am currently able to produce, I need a way to alternate between 3 colours for the table rows.

    <style type="text/css">
    tr.d0 td {
        background-color: #FFFFFF; color: black;

    }
    tr.d1 td {
        background-color: rgba(79, 129, 128, .2); color: black;

    }
    tr.d2 td {
        background-color: rgba(119, 149, 60, .2); color: black;

    }
    </style>

for($i =0; $i ...){

$rowclass = 0;
<tr class="d<?php echo $rowclass; ?>">

</tr>

$rowclass = 1 - $rowclass;

}

Upvotes: 0

Views: 770

Answers (4)

FarligOpptreden
FarligOpptreden

Reputation: 5043

Another possible solution not using PHP itself, but jQuery, could be as easy as:

$("table tr").each(function () {
    var i = $("table tr").index($(this));
    $(this).addClass("d" + (i % 3));
});

I created a jsFiddle to illustrate this scenario.

Upvotes: 0

abhinav
abhinav

Reputation: 3217

Not related to PHP, but, if you're using CSS3, it supports some structural pseudo classes. You could try using :nth-of-type(3n), :nth-of-type(3n+1),:nth-of-type(3n+2) to do this.

Upvotes: 3

rjz
rjz

Reputation: 16510

You're looking for the modulo operator. That's % in PHP (and most C-style languages), and it will get you the remainder of whatever number you're dividing by. In this case, you can use it to construct the className for each row like this:

for ($i=0; $i < $max, $i++) {
  $className = 'd' . ($i % 3);

  echo '<tr class="' . $className . '">';
  // do something with the row
  echo '</tr>';
}

Upvotes: 0

Amadan
Amadan

Reputation: 198324

$rowclass = (1 + $rowclass) % 3;

or even better, scrap that and just use

$i % 3

instead.

Upvotes: 2

Related Questions