Help.... I need to know how to make a select box change a picture. [Archive] - HTML Forums

J88Duke

03-10-2006, 03:34 PM

Ok I want to make it so when you are chosing a color for my product that it shows the picture in a designated box off to the side or right below (haven't decided) Does anyone know the code for this?

The only example I could find is on the neopets website when you are selecting a pet and you chose a color it changes the picture. Please help.

_Aerospace_Eng_

03-10-2006, 03:56 PM

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script type="text/javascript">
function setColor(obj)
{
var theholder = document.getElementById('holder');
if(obj.options[obj.options.selectedIndex].value == "blue")
{
theholder.src = "yourblueimage.jpg";
}
if(obj.options[obj.options.selectedIndex].value == "red")
{
theholder.src = "yourredimage.jpg";
}
if(obj.options[obj.options.selectedIndex].value == "green")
{
theholder.src = "yourgreenimage.gif";
}
}
</script>
</head>

<body>
<form>
<select name="color" onchange="setColor(this)">
<option value="blue" selected="selected">Blue</option>
<option value="red">Red</option>
<option value="green">Green</option>
</select>
<img src="yourblueimage.jpg" id="holder" alt="" title="">
</form>
</body>
</html>