...

View Full Version : images and radio buttons



moron
12-19-2003, 05:00 PM
I'm trying to swap three images at the same time by clicking a radio button.There are two radio buttons if you click one three images will replace three other images in a table.
the other button will replace three other images

Mr J
12-19-2003, 07:07 PM
Something on these lines?




<script>
<!--
function change_pic(){

if(document.f1.r1[0].checked==true){
document.getElementById("pic1").src="pic02.jpg"
document.getElementById("pic2").src="pic02.jpg"
document.getElementById("pic3").src="pic02.jpg"
}

if(document.f1.r1[1].checked==true){
document.getElementById("pic1").src="pic01.jpg"
document.getElementById("pic2").src="pic01.jpg"
document.getElementById("pic3").src="pic01.jpg"
}

}
// -->
</script>


<form name="f1">
<input type="radio" name="r1" onclick="change_pic()">
<input type="radio" name="r1" onclick="change_pic()">
</form>


<table border="1">
<tr>
<td><img id="pic1" src="pic01.jpg"></td>
<td><img id="pic2" src="pic01.jpg"></td>
<td><img id="pic3" src="pic01.jpg"></td>
</tr>
</table>

moron
12-19-2003, 08:28 PM
here is what I'm doing in the first column lies the radio buttons , the second column contains three blank images when I click on the one radio button the three images need to change to something else. when the other button is clicked three seperate images are to be displayed.

<html>
<head>
<title>Final Exam</title>
<script language="JavaScript">
!-->


//-->
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<table width="593" border="0" cellspacing="0" cellpadding="0" height="376">
<tr>
<td colspan="3" height="56">
<center>
<H1>Santa's List Self Declaration</H1>
</center>
</td>
</tr>
<td>
<div align="center"><font size="5">1</font> <font size="2">Rate Your Behavior</font>
<p>
<Input type="radio" name="attitude" value="good">
Good
<p>
<Input type="radio" name="attitude" value="good">
Bad
</div>
</td>
<td>
<p align="center">&nbsp;</p>
<p align="center">&nbsp;</p>
<p align="center"><font size="5">2</font> <font size="2">Choose Your Reward</font>
</p>
<p align="center"><img src="spacer.gif" width="96" height="104"></p>
<p align="center"><img src="spacer2.gif" width="96" height="104"></p>
<p align="center"><img src=spacer3.gif" width="96" height="104"></p>
</td>
<td width="198" height="30">
<p align="center"><font size="5">3</font> <font size="2">Enter your E-Mail Address </font>
<Input type="text">
</p>
<div align="center"><font size="5">4</font> <font size="2">Confirm Your Choice</font>
<Input type="text"><Input type="submit" value="submit">
</div>
<p align="center"> <font size="5">?</font> <font size="2">Click on the Elf
for Help</font></p>
<p align="center"> <img src="elf.gif" width="96" height="104">
</p>
</td>
</tr>
</table>
</body>
</html>



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum