CSS question?

[JayGeePee]

I'm not sure how to do this or if its possible with CSS/HTML. I have tables that hold info on my index page that is entered from the members area. The table has a plain white background, which isn't my problem. I'd like it if when new info is entered it changes between two colors. White and Grey... I want the tables to switch between two colors every time new info is entered. I cant explain this very well. Heres an example -

blah blah blah info is here - White background
blah blah blah new info here - Grey background
blah blah blah newer is here - White background
blah blah blah newest info here - Grey background

The example I'm getting at can be seen here, scroll down the page until you see "The 30 Latest Featured Projects"

Thanks in advance!

[pritaeas]

See this example.

[JayGeePee]

See this example.

Its funny you showed me that link... I just found it a little while ago. I had no idea it was called - jQuery Advanced Striping. Now I have to figure out how to code this in to my current code. Thanks!

[JayGeePee]

I cant seem to get this code to work with my table code below -

<script src="jquery.js"></script>
 <script type="text/javascript">
 $(document).ready(function(){
   $(".stripeMe tr").mouseover(function(){$(this).addClass("over");}).mouseout(function(){$(this).removeClass("over");});
   $(".stripeMe tr:even").addClass("alt");
 });
</script>

Table Code

<table width="780" cellpadding="0" cellspacing="0" border="0">
        <tr style="background-image: url(templates/{TPL_NAME}/images/tr-background.jpg); background-repeat: repeat-x;" align="center" class="table_titles">
          <td width="40%" align="left" height="18" style="padding-left:5px;">{TEMP}</td>
          <td width="6%">{LANG}</td>
          <td width="30%" align="left" style="padding-left:5px;">{TEMP}</td>
          <td width="12%">{LANG}</td>
          <td width="12%">{LANG}</td>
        </tr>
  {LOOP: FEAT_TEMP}
  <tr align="center" class="table_titles">
    <td align="left" style="padding-left:5px;"><a href="{TEMP}">{TEMP}</a></td>
    <td>{TEMP.temp}</td>
    <td align="left" style="padding-left:5px;">{TEMP}</td>
    <td>{TEMP}</td>
    <td>{TEMP}</td>
  </tr>
  <tr>
    <Td colspan="5" background="templates/{TPL_NAME}/images/hline_dot.gif"><img src="templates/{TPL_NAME}/images/dot.gif" width="1" height="1" alt="" border="0"></TD>
  </tr>
  {/LOOP: FEAT.temp}
  <tr>
    <td colspan="5"><a href="temp.php?filter=featured"><img src="templates/{TPL_NAME}/images/button_viewall.gif" width="76" height="16" alt="" border="0" hspace="0" vspace="10"></a></td>
  </tr>
      </table>

Here's the CSS

tr.alt td {
background: #ecf6fc;
}

tr.over td {
background: #bcd4ec;
}

[Lsmjudoka]

Here's a protip: This is the PHP forum. Most people here will know how to code PHP scripts well. You should take your question over to the HTML/CSS forum here: http://www.daniweb.com/forums/forum143.html

Or if it's the Javascript not working, try here:
http://www.daniweb.com/forums/forum117.html

Your question doesn't seem to be relevant to PHP in any way, you can probably find more help there :)