Ver Mensaje Individual
  #5 (permalink)  
Antiguo 05/11/2010, 14:26
vassily
 
Fecha de Ingreso: noviembre-2010
Mensajes: 7
Antigüedad: 13 años, 5 meses
Puntos: 0
Respuesta: Menú desplegable sobre un marco

Hola de nuevo, ya tenia todas las capas asignadas como "position:absolute;" pero eso no me sirve.

Es que no tengo claro si he de crear otro marco, al que redirigir la información, o hacerlo sobre la misma ventana que tengo el menú. Por lógica tendría que crear un nuevo marco, y que el menú se antepusiera a éste al desplegarse.

Una cosa tal como la de ésta página web y su menú.

Os dejo el código que tengo del menú desplegable:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<style type="text/css">
<!--
body {
background-color: #00FFFF;
}
.Estilo1 {
color: #003399;
font-weight: bold;
font-style: italic;
}
#general {
position:absolute;
width:217px;
height:52px;
z-index:4;
left: 283px;
top: 18px;
}
#menu1 {
position:absolute;
width:108px;
height:132px;
z-index:2;
left: 283px;
top: 55px;
}
#menu2 {
position:absolute;
width:108px;
height:132px;
z-index:3;
left: 395px;
top: 57px;
}
#cierre {
position:absolute;
width:100%;
height:90%;
z-index:5;
left: 9px;
top: 14px;
}
#cierre {
position:absolute;
width:100%;
height:90%;
z-index:1;
}
-->
</style>
<script type="text/JavaScript">
<!--
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}

function MM_showHideLayers() { //v6.0
var i,p,v,obj,args=MM_showHideLayers.arguments;
for (i=0; i<(args.length-2); i+=3) if ((obj=MM_findObj(args[i]))!=null) { v=args[i+2];
if (obj.style) { obj=obj.style; v=(v=='show')?'visible':(v=='hide')?'hidden':v; }
obj.visibility=v; }
}

function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
//-->
</script>
</head>

<body onload="MM_preloadImages('images/menu2sobre.jpg','images/menu1.jpg','images/menu1sobre.jpg','images/menu2.jpg')">

<p>&nbsp;</p>
<div id="general">
<div align="center">
<table width="224" border="1">
<tr>
<td width="104"><img src="images/menu1.jpg" alt="menu1" name="botmenu1" width="104" height="31" id="botmenu1" onmouseover="MM_swapImage('botmenu1','','images/menu1sobre.jpg',1);MM_swapImage('botmenu2','','ima ges/menu2.jpg',1);MM_showHideLayers('menu1','','show', 'menu2','','hide','cierre','','show')" /></td>
<td width="142"><img src="images/menu2.jpg" alt="menu2" name="botmenu2" width="104" height="31" id="botmenu2" onmouseover="MM_swapImage('botmenu2','','images/menu2sobre.jpg',1);MM_swapImage('botmenu1','','ima ges/menu1.jpg',1);MM_showHideLayers('menu1','','hide', 'menu2','','show','cierre','','show')" /></td>
</tr>
</table>
</div></div>
<div id="menu1">
<table width="100%" height="130" border="1" bgcolor="#00CCFF">
<tr>
<td><a href="http://www.marca.com/" target="mainFrame">texto1</a></td>
</tr>
<tr>
<td>texto2</td>
</tr>
<tr>
<td>texto3</td>
</tr>
<tr>
<td>texto4</td>
</tr>
</table>
</div>
<div id="menu2">
<table width="99%" height="131" border="1" bgcolor="#00CCFF">
<tr>
<td>contenido1</td>
</tr>
<tr>
<td>contenido2</td>
</tr>
<tr>
<td>contenido3</td>
</tr>
<tr>
<td>contenido4</td>
</tr>
</table>
</div>
<div id="cierre"><img src="images/shim.gif" width="746" height="338" onmouseover="MM_swapImage('botmenu1','','images/menu1.jpg',1);MM_swapImage('botmenu2','','images/menu2.jpg',1);MM_showHideLayers('menu1','','hide', 'menu2','','hide','cierre','','hide')" /></div>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p align="center">Esto es lo que quiero que se quede por debajo del menú. Con este texto si que funciona </p>
</body>
</html>

1 saludo y gracias por la ayuda.