Menú script con muchos enlaces

Pincha en la imagen para verlo en acción:

Mira que práctico y fácil de subir al blog. En el código vas a ver que está la manera de editarlo. Para eso lo podes hacer en linea usando el [editor] ya que no necesita ningún agregado a la plantilla.
Una vez que lo armaste como a vos te gusta, con los enlaces y colores para que quede bien en tu blog, copias y pegas desde añadir elemento de página / HTML/Javascript y lo pones en su lugar.
El código:

<!--Aca editas el menú - a medida que pongas más vas cambiando esto showit(?) -->

| <a onmouseover="showit(0)" href="http://webjcp.blogspot.com/">Menú 1</a> | <a onmouseover="showit(1)" href="http://webjcp.blogspot.com/">Menú 2</a> | <a onmouseover="showit(2)" href="http://webjcp.blogspot.com/">Menú 3</a> | <a onmouseover="showit(3)" href="http://webjcp.blogspot.com/">Menú 4</a> |<br/>

<!-- Aca se edita el largo y ancho - color de letra - color de fondo --->

<ilayer width="400" height="22" name="dep1" bgcolor="#800000">
<layer width="400" name="dep2" height="22">
</layer>
</ilayer>
<div id="describe" style="color:#000000;background-color:#FFD401;width:400px;height:22px" onmouseover="clear_delayhide()" onmouseout="resetit(event)"></div>


<script language="JavaScript1.2">


var submenu=new Array()

<!--Aca editas los enlaces - el submenu [?] debe coincidir con el menú showit(?) -->

submenu[0]='<font face="Verdana" size="2"><b><a href="http://webjcp.blogspot.com/">Enlace 1</a> | <a href="http://webjcp.blogspot.com/">Enlace 2</a> | <a href="http://webjcp.blogspot.com/">Enlace 3</a> | <a href="http://webjcp.blogspot.com/">Enlace 4</a></font>'

submenu[1]='<font face="Verdana" size="2"><b><a href="http://webjcp.blogspot.com/">Enlace 5</a> | <a href="http://webjcp.blogspot.com/">Enlace 6</a> | <a href="http://webjcp.blogspot.com/">Enlace 7</a> | <a href="http://webjcp.blogspot.com/">Enlace 8</a></font>'

submenu[2]='<font face="Verdana" size="2"><b><a href="http://webjcp.blogspot.com/">Enlace 9</a> | <a href="http://webjcp.blogspot.com/">Enlace 10</a> | <a href="http://webjcp.blogspot.com/">Enlace 11</a> | <a href="http://webjcp.blogspot.com/">Enlace 12</a></font>'

submenu[3]='<font face="Verdana" size="2"><b><a href="http://webjcp.blogspot.com/">Enlace 13</a> | <a href="http://webjcp.blogspot.com/">Enlace 14</a> | <a href="http://webjcp.blogspot.com/">Enlace 15</a> | <a href="http://webjcp.blogspot.com/">Enlace 16</a></font>'


//aca editas el tiempo que los enlaces están a la vista
var delay_hide=500

/////No tocar desde aca -saca los dedos ;)

var menuobj=document.getElementById? document.getElementById("describe") : document.all? document.all.describe : document.layers? document.dep1.document.dep2 : ""

function showit(which){
clear_delayhide()
thecontent=(which==-1)? "" : submenu[which]
if (document.getElementById||document.all)
menuobj.innerHTML=thecontent
else if (document.layers){
menuobj.document.write(thecontent)
menuobj.document.close()
}
}

function resetit(e){
if (document.all&&!menuobj.contains(e.toElement))
delayhide=setTimeout("showit(-1)",delay_hide)
else if (document.getElementById&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhide=setTimeout("showit(-1)",delay_hide)
}

function clear_delayhide(){
if (window.delayhide)
clearTimeout(delayhide)
}

function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}

</script>