Help with html drop down menu!!

Hey guys..

I have made this drop down menu, which can selec different pictures.
The initial menu value is "Change colour...", and then there 3 options.
My question is difficult for me to explain, but here it goes:
If you select the colour "red", a matching picture will appear. But if you select the option "Change colour" afterwards, the picture disappers and becomes an empty square. I want the previous picture to stay, if someone should press "change colour".

Hope you can understand my question, and know how to help me.


<script language="javascript">

function linkrotate(which){
var mylinks=new Array()

mylinks[1]="ramdom url"
mylinks[2]="ramdom url"
mylinks[3]="ramdom url"

window.location=mylinks[which]
}

function showimage()
{
if (!document.images)
return
document.images.pictures.src=
document.mygallery.picture.options[document.mygallery.picture.selectedIndex].value
}
</script>


<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="100%"><form name="mygallery"><p><select
name="picture" size="1" onChange="showimage()">
<option value"">Change colour...</option>
<option value="img1 url">Red</option>
<option value="img2 url">Blue</option>
<option value="img3 url">Green</option>
</select></p>
</form>
</td>
</tr>
<tr>
<td width="100%"><p align="center"><a href="javascript:linkrotate(document.mygallery.picture.selectedIndex)" onMouseover="window.status='';return true"><img src="img1 url" name="pictures" width="99"
height="100" border=0></a></td>
</tr>
</table>

Hello MilanT,
Your problem relies on images to demonstrate it, the snippet you've given us is not enough information.
Can you give us a link to the test site?
You could always zip up the entire code and images and put it somewhere we could download it.

This should work for you.

<script language="javascript">

function linkrotate(which){
var mylinks=new Array()

mylinks[1]="ramdom url"
mylinks[2]="ramdom url"
mylinks[3]="ramdom url"

window.location=mylinks[which]
}

function showimage()
{
if (!document.images)
return
var select = document.getElementById("myselect").selectedIndex;
if (select != 0) {
document.images.pictures.src=
document.mygallery.picture.options[document.mygallery.picture.selectedIndex].value;
}
}
</script>


<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="100%"><form name="mygallery"><p><select
id="myselect" name="picture" size="1" onChange="showimage()">
<option value"">Change colour...</option>
<option value="img1 url">Red</option>
<option value="img2 url">Blue</option>
<option value="img3 url">Green</option>
</select></p>
</form>
</td>
</tr>
<tr>
<td width="100%"><p align="center">
<a href="javascript:linkrotate(document.mygallery.picture.selectedIndex)" onMouseover="window.status='';return true">
<img src="img1 url" name="pictures" width="99"
height="100" border=0></a></td>
</tr>
</table>

Thanks man...works perfectly!!!