Forums
This topic is locked
Table colors
Replies
Replied 20 May 2003 12:50:55
20 May 2003 12:50:55 james crellin replied:
Zabi -
Usually you have something like the code below that makes up your table or cell.
Paste the bold red portion of it into the <TD tag. It should look like the code below. Change the green portion of the code to change the colors. You can use a hex code (ie: #FF6000) or use primary text colors (ie: red, blue, lightblue...)
=============================================
<TABLE width="200" border="1" cellspacing="0" cellpadding="0">
<TR>
<TD style="width:100%; background-color:<font color=green>lightblue</font id=green>"
<font color=red><b>onMouseover="this.style.backgroundColor='<font color=green>yellow</font id=green>';"
onMouseout="this.style.backgroundColor='<font color=green>lightblue</font id=green>';"></b></font id=red>
Watch me get scared!
</TD>
</TR>
</TABLE>
=============================================
I hope that helps you out some.
<img src="www.syndicprint.com/o_chacon/jtc_sig.gif" border=0>
<b>"I learn so I can help."</b> =- Saleblitz
Usually you have something like the code below that makes up your table or cell.
Paste the bold red portion of it into the <TD tag. It should look like the code below. Change the green portion of the code to change the colors. You can use a hex code (ie: #FF6000) or use primary text colors (ie: red, blue, lightblue...)
=============================================
<TABLE width="200" border="1" cellspacing="0" cellpadding="0">
<TR>
<TD style="width:100%; background-color:<font color=green>lightblue</font id=green>"
<font color=red><b>onMouseover="this.style.backgroundColor='<font color=green>yellow</font id=green>';"
onMouseout="this.style.backgroundColor='<font color=green>lightblue</font id=green>';"></b></font id=red>
Watch me get scared!
</TD>
</TR>
</TABLE>
=============================================
I hope that helps you out some.
<img src="www.syndicprint.com/o_chacon/jtc_sig.gif" border=0>
<b>"I learn so I can help."</b> =- Saleblitz
Replied 20 May 2003 14:19:04
20 May 2003 14:19:04 zabi baig replied:
Hi Saleblitz,
Thanks for ur help!
This code works, but my requirement is that once i click on table header of a column i need to change the color of entier columnn and vice versa of rows. and again i clikck on column or row it should come to normal.. any idea how it works .
Thanks
zabi
Thanks for ur help!
This code works, but my requirement is that once i click on table header of a column i need to change the color of entier columnn and vice versa of rows. and again i clikck on column or row it should come to normal.. any idea how it works .
Thanks
zabi
Replied 20 May 2003 20:56:38
20 May 2003 20:56:38 james crellin replied:
Hey Zab-
I'm pretty sure i understand what you are wanting now. However, I can only get it to change the row color. Try this code that I found below. Maybe it will work for you somehow or you can change it a little bit. I dont have time to try and reconfigure it right now. Good Luck!
-=- saleblitz
========================================================
<html>
<head>
<script>
//+-+-+-+-+-+-+-+-+-+-+-+-+for highlight row+-+-+-+-+-+-+-+-+-+-+-+-+//
//desc: Highligt current row by click any cell
//by: Qing-Hua Jiang
//argument: backColor - highlight bgColor of the row
// textColor - lighlight text color
//call: like <tr onClick="HighLightTR('#c9cc99','cc3333');" id="trO4">
var preEl ;
var orgBColor;
var orgTColor;
function HighLightTR(backColor,textColor){
if(typeof(preEl)!='undefined') {
preEl.bgColor=orgBColor;
try{ChangeTextColor(preEl,orgTColor);}catch(e){;}
}
var el = event.srcElement;
el = el.parentElement;
orgBColor = el.bgColor;
orgTColor = el.style.color;
el.bgColor=backColor;
try{ChangeTextColor(el,textColor);}catch(e){;}
preEl = el;
}
function ChangeTextColor(a_obj,a_color){ ;
for (i=0;i<a_obj.cells.length;i++){//put condition before increase!!!!!
a_obj.cells(i).style.color=a_color;
}
}
//+-+-+-+-+-+-+-+-+-+-+-+-+End of highlight row+-+-+-+-+-+-+-+-+-+-+-+-+//
</script>
</head>
<body>
<table border=1 align=center>
<caption>Hank Greenberg Career Statistics</caption>
<th>Year</th>
<th>Team</th>
<th>AVG</th>
<th>AB</th>
<th>R</th>
<th>H</th>
<th>Double</th>
<th>Triple</th>
<th>HR</th>
<th>RBI</th>
<th>BB</th>
<th>SO</th>
<th>SB</th>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=right>1938</td>
<td align=right>Detroit</td>
<td align=right>.315</td>
<td align=right>556</td>
<td align=right>144</td>
<td align=right>175</td>
<td align=right>23</td>
<td align=right>4</td>
<td align=right>58</td>
<td align=right>146</td>
<td align=right>119</td>
<td align=right>92</td>
<td align=right>7</td>
</tr>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=right>1939</td>
<td align=right>Detroit</td>
<td align=right>.312</td>
<td align=right>500</td>
<td align=right>112</td>
<td align=right>156</td>
<td align=right>42</td>
<td align=right>7</td>
<td align=right>33</td>
<td align=right>112</td>
<td align=right>91</td>
<td align=right>95</td>
<td align=right>8</td>
</tr>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=right>1940</td>
<td align=right>Detroit</td>
<td align=right>.340</td>
<td align=right>573</td>
<td align=right>129</td>
<td align=right>195</td>
<td align=right>50</td>
<td align=right>8</td>
<td align=right>41</td>
<td align=right>150</td>
<td align=right>93</td>
<td align=right>75</td>
<td align=right>6</td>
</tr>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=right>1941</td>
<td align=right>Detroit</td>
<td align=right>.269</td>
<td align=right>67</td>
<td align=right>12</td>
<td align=right>18</td>
<td align=right>5</td>
<td align=right>1</td>
<td align=right>2</td>
<td align=right>12</td>
<td align=right>16</td>
<td align=right>12</td>
<td align=right>1</td>
</tr>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=right>1942</td>
<td align=right>Detroit*</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
</tr>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=center colspan=2>Total</td>
<td align=right>.313</td>
<td align=right>5193</td>
<td align=right>1051</td>
<td align=right>1628</td>
<td align=right>379</td>
<td align=right>71</td>
<td align=right>331</td>
<td align=right>1276</td>
<td align=right>852</td>
<td align=right>844</td>
<td align=right>58</td>
</tr>
</table>
<center>
</center>
</body>
</html>
========================================================
<img src="www.syndicprint.com/o_chacon/jtc_sig.gif" border=0>
<b>"I learn so I can help."</b> =- Saleblitz
I'm pretty sure i understand what you are wanting now. However, I can only get it to change the row color. Try this code that I found below. Maybe it will work for you somehow or you can change it a little bit. I dont have time to try and reconfigure it right now. Good Luck!
-=- saleblitz
========================================================
<html>
<head>
<script>
//+-+-+-+-+-+-+-+-+-+-+-+-+for highlight row+-+-+-+-+-+-+-+-+-+-+-+-+//
//desc: Highligt current row by click any cell
//by: Qing-Hua Jiang
//argument: backColor - highlight bgColor of the row
// textColor - lighlight text color
//call: like <tr onClick="HighLightTR('#c9cc99','cc3333');" id="trO4">
var preEl ;
var orgBColor;
var orgTColor;
function HighLightTR(backColor,textColor){
if(typeof(preEl)!='undefined') {
preEl.bgColor=orgBColor;
try{ChangeTextColor(preEl,orgTColor);}catch(e){;}
}
var el = event.srcElement;
el = el.parentElement;
orgBColor = el.bgColor;
orgTColor = el.style.color;
el.bgColor=backColor;
try{ChangeTextColor(el,textColor);}catch(e){;}
preEl = el;
}
function ChangeTextColor(a_obj,a_color){ ;
for (i=0;i<a_obj.cells.length;i++){//put condition before increase!!!!!
a_obj.cells(i).style.color=a_color;
}
}
//+-+-+-+-+-+-+-+-+-+-+-+-+End of highlight row+-+-+-+-+-+-+-+-+-+-+-+-+//
</script>
</head>
<body>
<table border=1 align=center>
<caption>Hank Greenberg Career Statistics</caption>
<th>Year</th>
<th>Team</th>
<th>AVG</th>
<th>AB</th>
<th>R</th>
<th>H</th>
<th>Double</th>
<th>Triple</th>
<th>HR</th>
<th>RBI</th>
<th>BB</th>
<th>SO</th>
<th>SB</th>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=right>1938</td>
<td align=right>Detroit</td>
<td align=right>.315</td>
<td align=right>556</td>
<td align=right>144</td>
<td align=right>175</td>
<td align=right>23</td>
<td align=right>4</td>
<td align=right>58</td>
<td align=right>146</td>
<td align=right>119</td>
<td align=right>92</td>
<td align=right>7</td>
</tr>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=right>1939</td>
<td align=right>Detroit</td>
<td align=right>.312</td>
<td align=right>500</td>
<td align=right>112</td>
<td align=right>156</td>
<td align=right>42</td>
<td align=right>7</td>
<td align=right>33</td>
<td align=right>112</td>
<td align=right>91</td>
<td align=right>95</td>
<td align=right>8</td>
</tr>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=right>1940</td>
<td align=right>Detroit</td>
<td align=right>.340</td>
<td align=right>573</td>
<td align=right>129</td>
<td align=right>195</td>
<td align=right>50</td>
<td align=right>8</td>
<td align=right>41</td>
<td align=right>150</td>
<td align=right>93</td>
<td align=right>75</td>
<td align=right>6</td>
</tr>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=right>1941</td>
<td align=right>Detroit</td>
<td align=right>.269</td>
<td align=right>67</td>
<td align=right>12</td>
<td align=right>18</td>
<td align=right>5</td>
<td align=right>1</td>
<td align=right>2</td>
<td align=right>12</td>
<td align=right>16</td>
<td align=right>12</td>
<td align=right>1</td>
</tr>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=right>1942</td>
<td align=right>Detroit*</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
<td align=right>0</td>
</tr>
<tr onClick="HighLightTR('#c9cc99','cc3333');" >
<td align=center colspan=2>Total</td>
<td align=right>.313</td>
<td align=right>5193</td>
<td align=right>1051</td>
<td align=right>1628</td>
<td align=right>379</td>
<td align=right>71</td>
<td align=right>331</td>
<td align=right>1276</td>
<td align=right>852</td>
<td align=right>844</td>
<td align=right>58</td>
</tr>
</table>
<center>
</center>
</body>
</html>
========================================================
<img src="www.syndicprint.com/o_chacon/jtc_sig.gif" border=0>
<b>"I learn so I can help."</b> =- Saleblitz