Men煤 desplegable.
Xabier
26 de Abril del 2005
Bues mi pregunta es esa.
驴C贸mo puedo hacer un men煤 desplegable en html?
Esto es, quiero que cuando pase el rat贸n por encima de una opci贸n me aparezcan 3 subopciones sobre las que puedo pinchar,
Gracias.
驴C贸mo puedo hacer un men煤 desplegable en html?
Esto es, quiero que cuando pase el rat贸n por encima de una opci贸n me aparezcan 3 subopciones sobre las que puedo pinchar,
Gracias.
tamy
26 de Abril del 2005
espero q este sea el q tu quieres jejej : pruebalo!
<html><head>
<style>
.itMenu{position: absolute; clip: rect( ); background:#2D6CAA; visibility: hidden}
.cabMenu{position: absolute; clip: rect( ); color:white; background:#003266}
a{color:#D3E533;font-family:verdana;text-decoration:underline}
a:hover{color:white;font-family:verdana;font-weight:bold;text-decoration:underline}</style>
<script language="JavaScript">
var mie =(navigator.appName.indexOf("Microsoft")>=0)
var itemOrig;
function despMenu(nombre,sn)
{
obj = document.all[nombre];
if (sn>0)
obj.style.visibility = "visible";
else
obj.style.visibility = "hidden";
}
function destacar(obj, val)
{
if (val==1)
{
itemOrig = obj.style.backgroundColor;
obj.style.backgroundColor="#3D6C9A";
}
else
obj.style.backgroundColor= itemOrig;
}
</script>
</HEAD>
<body bgcolor="#FFFFFF">
<font size="2" face="verdana">
<div id="Menu1" onMouseOver="despMenu(\'itMenu1\',1)" onMouseout="despMenu(\'itMenu1\',1)" style="width:115;height:20;z-index:2; left: 0px; top: 0px" class="cabMenu">
<center><b>Texto del men煤</b>
</center>
</div>
<div id="itMenu1" style="width:115;height:50;z-index:1;
left:115px;top:0" class="itMenu" onMouseOver="despMenu(this.id,1)" onMouseout="despMenu(this.id,0)">
<div id="itMenu11" class="itMenuDes" onMouseover="destacar(this,1)" onMouseout="destacar(this,0)">
<center><a target="Frame3" href="Direcci贸n 1" >Direcci贸n 1</a>
</div>
<div id="itMenu12" class="itMenuDes" onMouseover="destacar(this,1)" onMouseout="destacar(this,0)" >
<center><a href="Direcci贸n 2">Direcci贸n 2</a>
</div>
<div id="itMenu13" class="itMenuDes" onMouseover="destacar(this,1)" onMouseout="destacar(this,0)" >
<center><a href="Direcci贸n 3">Direcci贸n 3</a>
</div>
</div>
<div id="Menu2" onMouseOver="despMenu(\'itMenu2\',1)" onMouseout="despMenu(\'itMenu2\',0)" style="width:115;height:20;z-index:2; left: 0px; top: 60px" class="cabMenu">
<center><b>Otro men煤</b>
</center>
</div>
<div id="itMenu2" style="width:115;height:50;z-index:1;
left:115px;top:60" class="itMenu" onMouseOver="despMenu(this.id,1)" onMouseout="despMenu(this.id,0)">
<div id="itMenu11" class="itMenuDes" onMouseover="destacar(this,1)" onMouseout="destacar(this,0)">
<center><a target="Frame3" href="Direcci贸n 1" > Otra Direcci贸n 1</a>
</div>
<div id="itMenu12" class="itMenuDes" onMouseover="destacar(this,1)" onMouseout="destacar(this,0)" >
<center><a href="Direcci贸n 2">Direcci贸n 2</a>
</div>
<div id="itMenu13" class="itMenuDes" onMouseover="destacar(this,1)" onMouseout="destacar(this,0)" >
<center><a href="Direcci贸n 3">Direcci贸n 3</a>
</div>
</div>
</body>
</html>
<html><head>
<style>
.itMenu{position: absolute; clip: rect( ); background:#2D6CAA; visibility: hidden}
.cabMenu{position: absolute; clip: rect( ); color:white; background:#003266}
a{color:#D3E533;font-family:verdana;text-decoration:underline}
a:hover{color:white;font-family:verdana;font-weight:bold;text-decoration:underline}</style>
<script language="JavaScript">
var mie =(navigator.appName.indexOf("Microsoft")>=0)
var itemOrig;
function despMenu(nombre,sn)
{
obj = document.all[nombre];
if (sn>0)
obj.style.visibility = "visible";
else
obj.style.visibility = "hidden";
}
function destacar(obj, val)
{
if (val==1)
{
itemOrig = obj.style.backgroundColor;
obj.style.backgroundColor="#3D6C9A";
}
else
obj.style.backgroundColor= itemOrig;
}
</script>
</HEAD>
<body bgcolor="#FFFFFF">
<font size="2" face="verdana">
<div id="Menu1" onMouseOver="despMenu(\'itMenu1\',1)" onMouseout="despMenu(\'itMenu1\',1)" style="width:115;height:20;z-index:2; left: 0px; top: 0px" class="cabMenu">
<center><b>Texto del men煤</b>
</center>
</div>
<div id="itMenu1" style="width:115;height:50;z-index:1;
left:115px;top:0" class="itMenu" onMouseOver="despMenu(this.id,1)" onMouseout="despMenu(this.id,0)">
<div id="itMenu11" class="itMenuDes" onMouseover="destacar(this,1)" onMouseout="destacar(this,0)">
<center><a target="Frame3" href="Direcci贸n 1" >Direcci贸n 1</a>
</div>
<div id="itMenu12" class="itMenuDes" onMouseover="destacar(this,1)" onMouseout="destacar(this,0)" >
<center><a href="Direcci贸n 2">Direcci贸n 2</a>
</div>
<div id="itMenu13" class="itMenuDes" onMouseover="destacar(this,1)" onMouseout="destacar(this,0)" >
<center><a href="Direcci贸n 3">Direcci贸n 3</a>
</div>
</div>
<div id="Menu2" onMouseOver="despMenu(\'itMenu2\',1)" onMouseout="despMenu(\'itMenu2\',0)" style="width:115;height:20;z-index:2; left: 0px; top: 60px" class="cabMenu">
<center><b>Otro men煤</b>
</center>
</div>
<div id="itMenu2" style="width:115;height:50;z-index:1;
left:115px;top:60" class="itMenu" onMouseOver="despMenu(this.id,1)" onMouseout="despMenu(this.id,0)">
<div id="itMenu11" class="itMenuDes" onMouseover="destacar(this,1)" onMouseout="destacar(this,0)">
<center><a target="Frame3" href="Direcci贸n 1" > Otra Direcci贸n 1</a>
</div>
<div id="itMenu12" class="itMenuDes" onMouseover="destacar(this,1)" onMouseout="destacar(this,0)" >
<center><a href="Direcci贸n 2">Direcci贸n 2</a>
</div>
<div id="itMenu13" class="itMenuDes" onMouseover="destacar(this,1)" onMouseout="destacar(this,0)" >
<center><a href="Direcci贸n 3">Direcci贸n 3</a>
</div>
</div>
</body>
</html>