hola!

estoy creando un menú emergente en mi web y tengo un problema con el script

el código que tengo para el script es el siguiente:

<script language="javascript">
function mostrar() {
menu.style.visibility = "visible";
menu2.style.visibility = "visible";
}

function ocultar() {
menu.style.visibility = "hidden";
menu2.style.visibility = "hidden";

}
</script>

y el código para el menú el siguiente:

<center><table width="400" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100" height="20" valign="top" onMouseOver="mostrar()" onMouseOut="ocultar()" >Menu 1</td>
<td width="100" height="20" valign="top" onMouseOver="mostrar()" onMouseOut="ocultar()" >Menu 2</td>
<td width="100" valign="top">Menu 3</td>
<td width="100" valign="top">Menu 4</td>
</tr>
</table></center>

<table id="menu" width="100" border="0" cellpadding="0" cellspacing="0" onMouseOut="ocultar()" onMouseOver="mostrar()" style="visibility:hidden">
<tr>
<td >
<div style="position: absolute; top: 57; left: 285; width: 100; height: 60">
<table width="100" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100" height="20" valign="top" >Submenu 1</td>
</tr>
<tr>
<td width="100" height="20" valign="top" >Submenu 2</td>
</tr>
<tr>
<td width="100" height="20" valign="top" >Submenu 3</td>
</tr>
</table>
</div>
</td>
</tr>
</table>

<table id="menu2" width="100" border="0" cellpadding="0" cellspacing="0" onMouseOut="ocultar()" onMouseOver="mostrar()" style="visibility:hidden<tr>
<td >
<div style="position: absolute; top: 56; left: 385; width: 100; height: 60">
<table width="100" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="100" height="20" valign="top" >Submenu 1</td>
</tr>
<tr>
<td width="100" height="20" valign="top" >Submenu 2</td>
</tr>
<tr>
<td width="100" height="20" valign="top" >Submenu 3</td>
</tr>
</table>
</div>
</td>
</tr>
</table>

funciona bastante bien pero el problema es que cuando poso el mouse sobre el "menu 1" o "menu 2"  se despliegan los submenus tanto de 1 como de 2 estoy 99% segura que el problema está en el script creo que tengo que mover algo para que "menu.style..." y "menu2.style..." sean independientes pero nada más no veo como

pleaaaaase help!!!!!

El problema es que en la función mostrar() y ocultar() incluyes el menú 1 y 2, ergo, al poner o quitar el cursor de un menú se van a mostrar u ocultar ambos.

Debes crear las funciones por separado, por ejemplo:

function mostrar1(){menu.style.visibility = "visible";}
 function ocultar1(){menu.style.visibility = "hidden";}
 function mostrar2(){menu2.style.visibility = "visible";}
 function ocultar2(){menu2.style.visibility = "hidden";}

Hola mira muchisisisismas gracias por responder solo me quedó una duda... el script quedó así

function mostrar1() {menu.style.visibility = "visible";} 
function ocultar1() {menu2.style.visibility = "hidden";} 
function mostrar2(){menu.style.visibility = "visible";}
function ocultar2(){menu2.style.visibility = "hidden";}

Pero me podrías decir dónde le modifico ya en el html? es que no logro que funcione correctamente, checa hice algunos cambios y quedó así:

<table><td onMouseOver="mostrar1()" onMouseOut="ocultar1()">Menu 1</td></table> 
<table style="position: absolute; top: 54; left: 60" id="menu" onMouseOut="ocultar1()" onMouseOver="mostrar1()" style="visibility:hidden">
    <td>submenu 1</td>
    <td>submenu 2</td>
    <td>submenu 3</td>
    <td>submenu 4</td>
   </table>
  
<table><td onMouseOver="mostrar2()" onMouseOut="ocultar2()">Menu 2</td></table>
<table style="position: absolute; top: 79; left: 61" id="menu2" onMouseOut="ocultar2()" onMouseOver="mostrar2()" style="visibility:hidden">
    <td>sub 1</td>
    <td>sub 2</td>
    <td>sub 3</td>
  </table>    
 
 
<table><td>Menu 3</td></table>
 <table  style="position: absolute; top: 105; left: 61; width: 39; height: 25" width="39" height="27">
    <td>sub 1</td>
    </table>

Pero... lo que sucede es que al pasar el mouse sobre "menu 1" ok se muestra pero ya no se oculta y luego al pasar el mouse por el menu 2 no aparece ya cambié los mostrar y ocultar con 1 y 2 pero nada... (seguramente no lo estoy haciendo bien...

gracias!!!

p.d. ah y gracias por hacerme notar como poner el código en el foro para que fuera más fácil

ahhhhh jajajaja perdón ya vi el error es que el script debe llevar un orden... mensa de mi. no encontré el botón para editar mi post así que sorry sorry soyrry por el post doble.

De nuevo mil mil mil gracias!!! por si a alguien más le sirve el script debe ir así:

function mostrar1() {menu.style.visibility = "visible";} 
function ocultar1() {menu.style.visibility = "hidden";} 
function mostrar2(){menu2.style.visibility = "visible";}
function ocultar2(){menu2.style.visibility = "hidden";}

y pues colocar el 1 en menu 1 y 2 en menu 2.

Danke Shoen!

jeje yo de nuevo. tengo otra duda y llevo todo el día en ella. -__- el menú anterior esta bien peara algo simple pero tengo otra web donde trabajo con un script mucho más complicado y tengo un problema... es un menú emergente pero hay submenús dentro de los submenús... el problema es que al desplegarse el tercer submenú se desaparece el segundo nivel... si no me explico bien la página es la siguiente:

http://patologiabmc.webcindario.com

en fin como ven cuando se posan en Patología Genral >> Lab histopatología se abre el otro layer que sólo contiene el link para lecturas... pero es un poco confuso porque el layer anterior desaparece totalmente....

mi script es el siguiente

var linkset=new Array()
//SPECIFY MENU SETS AND THEIR LINKS. FOLLOW SYNTAX LAID OUT
linkset[0]='<div class="menuitems"><a href="tempatg.htm">Temas</a></div>'
linkset[0]+='<div class="menuitems"><a href="tareasgen.htm">Tareas</a></div>'
linkset[0]+='<div class="menuitems"><a href="archivos/califgen_102(1).pdf">Calificaciones</a></div>' 
linkset[0]+='<div class="menuitems"><a >Programa labs</a></div>'
linkset[0]+='<div class="menuitems"><a >Links</a></div>'
linkset[0]+='<div class="menuitems"><a href="#" onMouseover="showmenu(event,linkset[2])" onMouseout="delayhidemenu()">lab histopatologia</a></div>'
linkset[2]='<div class="menuitems"><a >Lecturas</a></div>'
linkset[1]='<div class="menuitems"><a >Lecturas</a></div>'
linkset[1]+='<div class="menuitems"><a href="tareasesp.htm">Tareas</a></div>'
linkset[1]+='<div class="menuitems"><a >Presentaciones</a></div>'
linkset[1]+='<div class="menuitems"><a >Links</a></div>'
linkset[1]+='<div class="menuitems"><a href="archivos/calpe10-2.pdf" target="iframe" >Calificaciones</a></div>'
 
var ie4=document.all&&navigator.userAgent.indexOf("Opera")==-1
var ns6=document.getElementById&&!document.all
var ns4=document.layers
function showmenu(e,which){
if (!document.all&&!document.getElementById&&!document.layers)
return
clearhidemenu()
menuobj=ie4? document.all.popmenu : ns6? document.getElementById("popmenu") : ns4? document.popmenu : ""
menuobj.thestyle=(ie4||ns6)? menuobj.style : menuobj
if (ie4||ns6)
menuobj.innerHTML=which
else{
menuobj.document.write('<layer name=gui bgColor=#D9DDE8 width=800 onmouseover="clearhidemenu()" onmouseout="hidemenu()">'+which+'</layer>')
menuobj.document.close()
}
menuobj.contentwidth=(ie4||ns6)? menuobj.offsetWidth : menuobj.document.gui.document.width
menuobj.contentheight=(ie4||ns6)? menuobj.offsetHeight : menuobj.document.gui.document.height
eventX=ie4? event.clientX : ns6? e.clientX : e.x
eventY=ie4? event.clientY : ns6? e.clientY : e.y
var rightedge=ie4? document.body.clientWidth-eventX : window.innerWidth-eventX
var bottomedge=ie4? document.body.clientHeight-eventY : window.innerHeight-eventY
if (rightedge<menuobj.contentwidth)
menuobj.thestyle.left=ie8? document.body.scrollLeft+eventX-menuobj.contentwidth : ns8? window.pageXOffset+eventX-menuobj.contentwidth : eventX-menuobj.contentwidth
else
if (bottomedge<menuobj.contentheight)
menuobj.thestyle.top=ie4? document.body.scrollTop+eventY-menuobj.contentheight : ns6? window.pageYOffset+eventY-menuobj.contentheight : eventY-menuobj.contentheight
else
menuobj.thestyle.top=ie4? document.body.scrollTop+event.clientY : ns6? window.pageYOffset+eventY : eventY
menuobj.thestyle.visibility="visible"
return false
}
function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}
function hidemenu(){
if (window.menuobj)
menuobj.thestyle.visibility=(ie4||ns6)? "hidden" : "hide"
}
function dynamichide(e){
if (ie4&&!menuobj.contains(e.toElement))
hidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
hidemenu()
}
function delayhidemenu(){
if (ie4||ns6||ns4)
delayhide=setTimeout("hidemenu()",500)
}
function clearhidemenu(){
if (window.delayhide)
clearTimeout(delayhide)
}
function highlightmenu(e,state){
if (document.all)
source_el=event.srcElement
else if (document.getElementById)
source_el=e.target
if (source_el.className=="menuitems"){
source_el.id=(state=="on")? "mouseoverstyle" : ""
}
else{
while(source_el.id!="popmenu"){
source_el=document.getElementById? source_el.parentNode : source_el.parentElement
if (source_el.className=="menuitems"){
source_el.id=(state=="on")? "mouseoverstyle" : ""
}
}
}
}
if (ie4||ns6)
document.onclick=hidemenu

es la parte importante en el html solo va:

<a onMouseover="showmenu(event,linkset[0])" onMouseout="delayhidemenu()">Patologia General</a><p>
<a onMouseover="showmenu(event,linkset[1])" onMouseout="delayhidemenu()">Patologia Especial</a><hr>

supongo que el problema está en editar los onMouseOver... o algo así (en las órdenes del mouse) o en la parte en la que indica si un elemeno lo incluye otro.. "function contains..." y simplemente hice mal al agregar el linkset 2... para ser sincera este códio lo tomé de otra parte y lo fuí modificando a mi convenienicia pero debo admitir que si es un poco complicado (bueno para mi que no soy pro ni nada de eso)

Josepepe033 agradecería si tú me puedes orientar o si alguien más puede... ¡gracias!