this may not be possible, i hope it is.
i have a table that I use a radio button to change the background of different cells.
click radio1 = black[000000], radio2 = silver[999999], radio3 = blue[0099ff]
i can change the colors of each cell without effecting the other cells. this works fine.
the script gets an element of color for the cell, example black [ #000000 ]
i would like to be able to have another radio button when clicked,
pull in images to the cells. i have 52 images and each one would be able
to be pulled into each cell without effecting the other cells.
just like the background radio buttons.
the image could come from my sites image folder example: <IMG SRC="images/image1.png"
or from a hidden div located on the page. [ prefer from sites image folder if possible ]
thanks
here is the code that I have:
<HTML>
<HEAD>
<TITLE>Untitled</TITLE>
<SCRIPT TYPE="text/javascript">
function show(id)
{
document.getElementById(id
).style.di
splay='';
}
function hide(id)
{
document.getElementById(id
).style.di
splay='non
e';
}
</SCRIPT><SCRIPT
TYPE="text/javascript">
function hideDiv(range){
tag = document.getElementsByTagN
ame("div")
;
for(x=0;x<tag.length; x++){
if(tag[x].getAttribute('id
').indexOf
(range) != -1){
tag[x].style.display = "none";
}
}
}
function view(id){
ge = document.getElementById('c
hoose_' + id.value);
hideDiv("choose_" + id.value.substring(0,1)); //choose_a, choose_b or choose_c
ge.style.display = "block";
}
</SCRIPT></HEAD>
<BODY>
<P>
<!-- $MVD$:spaceretainer() --> </P>
<P>
<!-- $MVD$:spaceretainer() --> </P>
<P>
<!-- $MVD$:spaceretainer() --> </P>
<P>
<TABLE WIDTH="120" CELLPADDING="0" CELLSPACING="0" BORDER="0" ID="tableThis">
<TR>
<TD WIDTH="60" VALIGN=TOP>
<P ALIGN=CENTER>
</P>
<P ALIGN=CENTER>
<!-- $MVD$:spaceretainer() --> </TD>
<TD WIDTH="60" VALIGN=TOP>
<P ALIGN=CENTER>
</P>
<P ALIGN=CENTER>
<!-- $MVD$:spaceretainer() --> </TD>
</TR>
<TR>
<TD WIDTH="60" VALIGN=TOP>
<CENTER>
<P ALIGN=CENTER>
<INPUT TYPE=RADIO NAME="1" ONCLICK="document.getEleme
ntById('ta
bleThis').
rows[0].ce
lls[0].sty
le.backgro
undColor='
000000'"><
/P>
</CENTER>
<CENTER>
<P ALIGN=CENTER>
<INPUT TYPE=RADIO NAME="1" ONCLICK="document.getEleme
ntById('ta
bleThis').
rows[0].ce
lls[0].sty
le.backgro
undColor='
999999'"><
/P>
</CENTER>
<CENTER>
<P ALIGN=CENTER>
<INPUT TYPE=RADIO NAME="1" ONCLICK="document.getEleme
ntById('ta
bleThis').
rows[0].ce
lls[0].sty
le.backgro
undColor='
0099ff'"><
/P>
</CENTER>
<P ALIGN=CENTER>
cell 1</TD>
<TD WIDTH="60" VALIGN=TOP>
<CENTER>
<P ALIGN=CENTER>
<INPUT TYPE=RADIO NAME="2" ONCLICK="document.getEleme
ntById('ta
bleThis').
rows[0].ce
lls[1].sty
le.backgro
undColor='
000000'"><
/P>
</CENTER>
<CENTER>
<P ALIGN=CENTER>
<INPUT TYPE=RADIO NAME="2" ONCLICK="document.getEleme
ntById('ta
bleThis').
rows[0].ce
lls[1].sty
le.backgro
undColor='
999999'"><
/P>
</CENTER>
<CENTER>
<P ALIGN=CENTER>
<INPUT TYPE=RADIO NAME="2" ONCLICK="document.getEleme
ntById('ta
bleThis').
rows[0].ce
lls[1].sty
le.backgro
undColor='
0099ff'"><
/P>
</CENTER>
<P ALIGN=CENTER>
cell 2</TD>
</TR>
</TABLE></P>
<P>
<!-- $MVD$:spaceretainer() --> </P>
<P>
<TABLE WIDTH="400" CELLPADDING="0" CELLSPACING="0" BORDER="0">
<TR>
<TD WIDTH="60" VALIGN=TOP>
<P ALIGN=CENTER>
cell 1</P>
<P ALIGN=CENTER>
image1</P>
<CENTER>
<P ALIGN=CENTER>
<INPUT TYPE=RADIO NAME="cell 1" VALUE="a1" ONCLICK="document.getEleme
ntById('ta
bleThis').
rows[0].ce
lls[0].<
;IMG SRC="images/image1.pn
g">
;"></TD>
<TD WIDTH="60" VALIGN=TOP>
<P ALIGN=CENTER>
cell 1</P>
<P ALIGN=CENTER>
image2</P>
<CENTER>
<P ALIGN=CENTER>
<INPUT TYPE=RADIO NAME="cell 1" VALUE="a2" ONCLICK="document.getEleme
ntById('ta
bleThis').
rows[0].ce
lls[0].ima
ge2"></TD>
<TD WIDTH="60" VALIGN=TOP>
<P ALIGN=CENTER>
cell 2</P>
<P ALIGN=CENTER>
image1</P>
<CENTER>
<P ALIGN=CENTER>
<INPUT TYPE=RADIO NAME="cell 2" VALUE="a1" ONCLICK="document.getEleme
ntById('ta
bleThis').
rows[0].ce
lls[0].ima
ge1"></TD>
<TD WIDTH="60" VALIGN=TOP>
<P ALIGN=CENTER>
cell 2</P>
<P ALIGN=CENTER>
image2</P>
<CENTER>
<P ALIGN=CENTER>
<INPUT TYPE=RADIO NAME="cell 2" VALUE="a2" ONCLICK="document.getEleme
ntById('ta
bleThis').
rows[0].ce
lls[0].ima
ge2"></TD>
</TR>
</TABLE>
</BODY>
</HTML>
Start Free Trial