menu a comparsa che non deve scomparire

[InternetMania]

ciao a tutti ...
sapete dirmi come posso bloccare la comparsa di un "menu a comparsa" quando passo sopra col mouse ad una immagine: ecco i codici:

html + js:

<div class="page_head_top" onmouseover="displayItem(0)" onmouseout="hideItem(0)">
 [img]image/profile/color.PNG[/img]
</div>
 


<div class="page_head_top_color_option">
 [img]image/page_top_color_1.PNG[/img]
 [img]image/page_top_color_2.PNG[/img]
 [img]image/page_top_color_3.PNG[/img]
 [img]image/page_top_color_4.PNG[/img]
 [img]image/page_top_color_5.PNG[/img]
</div>
 


<script type="text/javascript">
var arrayOfDiv = null;
function displayItem(index)
{
if(!arrayOfDiv)
setArray();
arrayOfDiv[index].style.display = 'block';
}
function hideItem(index)
{
if(!arrayOfDiv)
setArray();
arrayOfDiv[index].style.display = 'none';
}
function setArray()
{
arrayOfDiv = new Array();
var count = 0;
var arr = document.getElementsByTagName('div');
for(i = 0; i < arr.length; i++)
{
if(arr[i].className.indexOf('page_head_top_color_option') >= 0)
{
arrayOfDiv[count++] = arr[i];
}
}
}
</script>

css:

.page_head_top_color_option
{
     margin-top:5px;
	 margin-left:5px;
     padding-left:15px;
	 padding-right:5px;
     float:left;
	 height:25px;
	 background:url(../image/layout/top_menu_color.PNG) no-repeat;
}
.page_head_top_color_option img
{
     padding-top:5px;
}

io dovrei fare in modo che quando passo col mouse sopra all'immagine nel primo div, appaiano le immagini in un'altro div (e questo l'ho fatto), però poi quando tolgo il puntatore dall'immagine, le altre immagini spariscono, invece io devo tenerle li, perche mi servono da link.
l'immagine in allegato vi aiuta meglio... (le immagini vanno al posto del testo, nell'allegato)

grazie a tutti