Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations gkittelson on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Dropdown Menu updating script...

Status
Not open for further replies.

ScrewzLuse

Programmer
Feb 18, 2002
2
US
Alright, I know that was sort of a confusing subject but you'll understand, hopefully, when you're done reading this. Alright, I'm workin on a site and want to create a site where I select something from an item on the dropdown menu, and then a picture updates to have the selected item from the dropdown menu. Alright, let me give you an example. Say I have a computer site and you're selecting from the case from the drop down menu. You don't see anything at first but when you select the desired case, a picture of the case comes up in the center. Then you move down to the motherboard and select a motherboard. The original picture is switched with an updated picture which I've made that contains a motherhboard and case. etc etc.

I know, it was probably confusing to understand but hopefully you get what I'm trying to say. Is there a javascript that will allow me to do this or some other kind of script?
 
I think this is the most simple way to do this:

<script>

if (document.images) {
img1=new Image();
img1.src=&quot;images/ibm.gif&quot;;
img2=new Image();
img2.src=&quot;images/dell.gif&quot;;
// ... the rest of images
}

function changeImage(imgNumb,imgFile)

if (document.images)
document.images
.src = eval(imgFile + '.src');
}

</script>

. . .

<img src=&quot;images/something.gif&quot; name=&quot;n1&quot; width=&quot;100&quot; height=&quot;100&quot; alt=&quot;&quot;>

<form name=&quot;form1&quot;>
<select name=&quot;comps&quot; onchange=&quot;changeImage(n1, this.value)&quot;>
<option selected></option>
<option value=&quot;ibm.gif&quot; >IBM</option>
<option value=&quot;dell.gif&quot;>Dell</option>
<option value=&quot;compaq.gif&quot;>Compaq</option>
<option value=&quot;micron.gif&quot;>Micron</option>
</select>
</form>

img1=new Image... is needed for all images preloading.
changeImage is an ordinary swap image function. It receives the value of selected option as an argument.


I wrote this &quot;on the fly&quot; and didn't test it, so it may require some debugging.
good luck
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top