Home Articles FAQs XREF Games Software Instant Books About Feedback Search Site-Map
irt.org logo

Q1529 How do I display an image based on the options selected from 3 different menus on the same page?

irt.org | Knowledge Base | JavaScript | Image | Q1529 [ previous next ]

Q1529 How do I display an image based on the options selected from 3 different menus on the same page?

Try:

<form onSubmit="return false">
<select name="hair">
<option value="">Hair color</option>
<option value="a">Brown</option>
<option value="b">Blonde</option>
<option value="c">Red</option>
<option value="d">Black</option>
</select>
<select name="skin">
<option value="">Skin color</option>
<option value="a">Brown</option>
<option value="b">White</option>
<option value="c">Red</option>
<option value="d">Yellow</option>
</select>
<select name="fabric">
<option value="">Fabric</option>
<option value="a">Brown</option>
<option value="b">White</option>
<option value="c">Purple</option>
<option value="d">Puce</option>
</select>
<input type="button"
onClick="
imageName = this.form.hair.value + this.form.skin.value+this.form.fabric.value;
if (imageName.length < 3) {
   alert('Please select something from all three options');
}
else {
   if (document.images)  document.images['doll'].src= imageName+'.gif'; // ie4+ ns3+
   else window.open(imageName+'.gif','newimage','width=300,height=400'); // ie3+
}" VALUE="GO!">
</form>
<img name="doll" src="blank.gif">

Now have images called: aaa.gif, aba.gif, aab.gif, abb.gif and so on.


Provide feedback ...
AddThis Social Bookmark Button

Provide feedback ... AddThis Social Bookmark Button


Last Updated: 30th March 2008. Maintained by: Martin Webb and Michel Plungjan
irt.org liability, trademark, document use, privacy statement and software licensing rules apply.
Copyright © 1996-2008 irt.org, All Rights Reserved.