Want to change color on click!?

[vcombs]

I am displaying data in a table on one of my web pages. When the user clicks on a row, I want that row ONLY to change color. I'd settle for that cell. I have a css file referenced on the page with two styles, td_on and td_off, which have same settings except for the background colors. I put the "class" tag in the td like so: <td align="center" class="td_off" >

I have tried to use the onclick action to change the class to the td_on style like so, onclick="class=td_on" but this does NOT cause any changes. Can someone tell me what the proper syntax for doing this is ... or maybe an easier way to accomplish what I want???!

TIA

[pajac]

Maybe u could try onclick="id='td_off'" . I'm not exacly shure if it is the write sintax, maybe it has to be something infront of " style='td_of' ", like TD or something. But I think this works.I'm new here to! ;)
Try and reply!

Ok I tried it myselfe and the only problem is vith IE couse u have to alow a "popup" if u wont it to work. :(
Firefox goes OK! :o

[pajac]

Use ID instead of class in css.

dont .something but #something ok.

[2ndPlatform]

I am displaying data in a table on one of my web pages. When the user clicks on a row, I want that row ONLY to change color. I'd settle for that cell. I have a css file referenced on the page with two styles, td_on and td_off, which have same settings except for the background colors. I put the "class" tag in the td like so: <td align="center" class="td_off" >

I have tried to use the onclick action to change the class to the td_on style like so, onclick="class=td_on" but this does NOT cause any changes. Can someone tell me what the proper syntax for doing this is ... or maybe an easier way to accomplish what I want???!

TIA

Here - if you haven't gotten it, try this:

This should be your TD in your HTML:

<td class="out" onMouseOver="this.className='over'" onMouseOut="this.className='out'"><a href="page.php">LINK</a></td>

Then in your stylesheet:

.over { background-color:#D0C0A9; padding-top: 2px; padding-bottom:2px;} 
.out { background-color: #E1D4C0; padding-top: 2px; padding-bottom:2px;}

That should do it for ya!

Let me know if you have problems, I'd be glad to help.

Shannon
Second Platform

[pajac]

God solution 2ndPlatform! :D
I'm missing some experiences at this field, but doing on that too. :mrgreen:

[billbob12345678]

I am displaying data in a table on one of my web pages. When the user clicks on a row, I want that row ONLY to change color. I'd settle for that cell. I have a css file referenced on the page with two styles, td_on and td_off, which have same settings except for the background colors. I put the "class" tag in the td like so: <td align="center" class="td_off" >

I have tried to use the onclick action to change the class to the td_on style like so, onclick="class=td_on" but this does NOT cause any changes. Can someone tell me what the proper syntax for doing this is ... or maybe an easier way to accomplish what I want???!

TIA

ok so here is what i used. i got the same situation you did. kinda. anyway if your just changing the background of a cell onClick do this <td onClick="this.bgcolor='000000'"> and for rows this <tr onClick="this.bgcolor='000000'"> now obviously you can change the colors as needed or desired but this worked for me.

[MasonShew]

Here are some cool JavaScript solutions:

• 
  
• http://cssglobe.com/lab/tablecloth/
• http://www.frequency-decoder.com/demo/table-actions/
• 
  
• http://www.flexigrid.info/