[SOLVED] Change Table color when a color is clicked

[npsari]

Hi

 

I have this Javascript

 

Everytime i click on a color box, this color code is typed in a tex field called C1

 

 

<form name="Code" method="POST" action="/code/scroll.php" enctype="text/plain" id="">

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function showColor(val) {
document.Code.C1.value = val;
}
//  End -->
</script>


<map name="colmap">
<area shape="rect" coords="1,1,7,10" href="javascript:showColor('#00FF00')">
<area shape="rect" coords="9,1,15,10" href="javascript:showColor('#00FF33')">
<area shape="rect" coords="17,1,23,10" href="javascript:showColor('#00FF66')">
<area shape="rect" coords="25,1,31,10" href="javascript:showColor('#00FF99')">
<area shape="rect" coords="33,1,39,10" href="javascript:showColor('#00FFCC')">
<area shape="rect" coords="41,1,47,10" href="javascript:showColor('#00FFFF')">
<area shape="rect" coords="49,1,55,10" href="javascript:showColor('#33FF00')">
<area shape="rect" coords="57,1,63,10" href="javascript:showColor('#33FF33')">
<area shape="rect" coords="65,1,71,10" href="javascript:showColor('#33FF66')">
<area shape="rect" coords="73,1,79,10" href="javascript:showColor('#33FF99')">
<area shape="rect" coords="81,1,87,10" href="javascript:showColor('#33FFCC')">
<area shape="rect" coords="89,1,95,10" href="javascript:showColor('#33FFFF')">
</map>

<a><img usemap="#colmap" src="http://www.example.com/code/colortable.gif" border=0 width=289 height=67></a>


<input type=text name=C1 size=7>


</form>

 

 

 

I want to do a little change to the code, so that, everytime i click on a color, the background of a Table changes

 

Here is my table

 

<table width="100%" border="1" cellpadding="0" cellspacing="0" bordercolor="#000000" style="background-color:#8B8B00" id="Table1">
<tr>
<td align="left" valign="top" width="128" height="150">
Hello There
</td>
</tr>
</table>

Do you think you can do this for me

 

How can the table backround change when a color box is clicked

 

I have the table html ready above, i just need the Javascript which will change it

 

If it is easy, please show me the javascript part

[phpQuestioner]

try this:

 

<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
function showColor(val) {
document.getElementById('myTable').style.background=val;
}
//  End -->
</script>


<map name="colmap">
<area shape="rect" coords="1,1,7,10" href="javascript:showColor('#00FF00')">
<area shape="rect" coords="9,1,15,10" href="javascript:showColor('#00FF33')">
<area shape="rect" coords="17,1,23,10" href="javascript:showColor('#00FF66')">
<area shape="rect" coords="25,1,31,10" href="javascript:showColor('#00FF99')">
<area shape="rect" coords="33,1,39,10" href="javascript:showColor('#00FFCC')">
<area shape="rect" coords="41,1,47,10" href="javascript:showColor('#00FFFF')">
<area shape="rect" coords="49,1,55,10" href="javascript:showColor('#33FF00')">
<area shape="rect" coords="57,1,63,10" href="javascript:showColor('#33FF33')">
<area shape="rect" coords="65,1,71,10" href="javascript:showColor('#33FF66')">
<area shape="rect" coords="73,1,79,10" href="javascript:showColor('#33FF99')">
<area shape="rect" coords="81,1,87,10" href="javascript:showColor('#33FFCC')">
<area shape="rect" coords="89,1,95,10" href="javascript:showColor('#33FFFF')">
</map>

<a><img usemap="#colmap" src="http://www.example.com/code/colortable.gif" border=0 width=289 height=67></a>


<table id="myTable" width="100%" border="1" cellpadding="0" cellspacing="0" bordercolor="#000000" style="background-color:#8B8B00" id="Table1">
<tr>
<td align="left" valign="top" width="128" height="150">
Hello There
</td>
</tr>
</table>

[npsari]

Hey. thanks much, it works nice now