Ver Mensaje Individual
  #3 (permalink)  
Antiguo 24/06/2009, 10:59
GabrielEnrique
 
Fecha de Ingreso: junio-2008
Mensajes: 47
Antigüedad: 17 años, 1 mes
Puntos: 0
Respuesta: posicionamiento de menu con capas

hola realize este ejemplo rapido para que me entiendan el problema como les comentaba es de que al cambiar una resolucion mas alta me cambia de posicion el menu.




Código HTML:
<html>

<head>
<meta http-equiv="Content-Language" content="es-mx">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>UNO</title>
</head>

<body>

<table border="1" width="100%" height="103">
	<tr>
		<td>&nbsp;</td>
	</tr>
	<tr>
		<td>
		<table border="1" cellpadding="0" cellspacing="0" width="100%" height="110%" bgcolor="#FF7200">
      <tr>
        <td width="109" align="center">
		<p align="right"><font color="#F8FAFC"><span style="font-size: 9pt"><b>
		UNO</b></span></font></td>
        <td width="6" align="center"><b> <font color="#F8FAFC" style="font-size: 9pt">
		|</font></b></td>
        <td width="126" align="center"  onmouseover="document.getElementById('capa1').style.visibility='visible' ;this.style.cursor='hand';" onmouseout="document.getElementById('capa1').style.visibility='hidden' ;this.style.cursor='hand';" ><p align="center">
		<b> <font color="#F8FAFC" style="font-size: 9pt">
		DOS </font></b></p></td>
        <td width="6" align="center"  onmouseover="document.getElementById('capa1').style.visibility='visible' ;this.style.cursor='hand';" onmouseout="document.getElementById('capa1').style.visibility='hidden' ;this.style.cursor='hand';" ><b> <font color="#F8FAFC" style="font-size: 9pt">
		|</font></b></td>
        <td width="133" align="center"  onmouseover="document.getElementById('capa2').style.visibility='visible' ;this.style.cursor='hand';"  onmouseout="document.getElementById('capa2').style.visibility='hidden' ;this.style.cursor='hand';" ><p align="center">
		<font color="#F8FAFC"><span style="font-size: 9pt"><b>TRES</b></span></font></p></td>
        <td width="6" align="center"  onmouseover="document.getElementById('capa2').style.visibility='visible' ;this.style.cursor='hand';"  onmouseout="document.getElementById('capa2').style.visibility='hidden' ;this.style.cursor='hand';" ><b> <font color="#F8FAFC" style="font-size: 9pt">
		|</font></b></td>
        <td width="135" align="center" onmouseover="document.getElementById('capa3').style.visibility='visible' ;this.style.cursor='hand';"  onmouseout="document.getElementById('capa3').style.visibility='hidden' ;this.style.cursor='hand';" ><p align="center">
		<font color="#F8FAFC"><span style="font-size: 9pt"><b>CUATRO</b></span></font></p></td>
        <td width="6" align="center" onmouseover="document.getElementById('capa3').style.visibility='visible' ;this.style.cursor='hand';"  onmouseout="document.getElementById('capa3').style.visibility='hidden' ;this.style.cursor='hand';" ><b> <font color="#F8FAFC" style="font-size: 9pt">
		|</font></b></td>
        <td width="127" align="center"><p align="center"><font color="#F8FAFC">
		<span style="font-size: 9pt"><b>CINCO</b></span></font></p></td>
        <td width="6" align="center"><p align="center"><b> <font color="#F8FAFC" style="font-size: 9pt"> 
		|</font></b></p></td>
        <td width="125" align="center"><p align="center"><b> <font color="#F8FAFC" style="font-size: 9pt">
		&nbsp;</font></b><font color="#F8FAFC"><span style="font-size: 9pt"><b>SEIS</b></span></font></p></td>
        <td width="6" align="center"><p align="center"><b> <font color="#F8FAFC" style="font-size: 9pt">
		|</font></b></p></td>
        <td width="127" align="center"><p align="left"><font color="#F8FAFC">
		<span style="font-size: 9pt"><b>SIETE</b></span></font></p></td>
      </tr>
    </table></td>
	</tr>
</table>
<div style="position: absolute; width: 138px; left: 135px; z-index:211; top:89px; float:right; visibility:hidden" id="capa1" onMouseOver="document.getElementById('capa1').style.visibility='visible' ;this.style.cursor='hand';" onMouseOut="document.getElementById('capa1').style.visibility='hidden' ;this.style.cursor='hand';">
					<table border="0" width="100%" cellspacing="0" cellpadding="0">
						<tr>
							<td>&nbsp;</td>
						</tr>
					</table>
					<table border="1" width="139" cellspacing="0" cellpadding="0" bordercolor="#FFFFFF">
						<tr>
							<td align="center" style="background:#FF7200; opacity:.7;  filter:alpha(opacity=80)"  onMouseOver="this.style.backgroundColor='#3366CC';this.style.cursor='hand';" onMouseOut="this.style.backgroundColor='#FF7200';">
							<font size="1" color="#FFF9F4"><b>UNO</b></font></td>
						</tr>
						<tr>
							<td align="center" style="background:#FF7200; opacity:.7;  filter:alpha(opacity=80)"onMouseOver="this.style.backgroundColor='#3366CC';this.style.cursor='hand';" onMouseOut="this.style.backgroundColor='#FF7200';">
							<font size="1" color="#FFFFFF"><b>DOS</b></font></td>
						</tr>
						</table>
				</div>
			<div style="position: absolute; width: 147px; left: 275px; top: 90px; z-index:203; height:68px; visibility:hidden" id="capa2" onMouseOver="document.getElementById('capa2').style.visibility='visible' ;this.style.cursor='hand';"  onMouseOut="document.getElementById('capa2').style.visibility='hidden' ;this.style.cursor='hand';" >
					<table border="0" width="100%" cellspacing="0" cellpadding="0">
						<tr>
							<td>&nbsp;</td>
						</tr>
					</table>
					<table border="1" width="146" cellspacing="0" cellpadding="0" bordercolor="#FFFFFF">
						<tr>
							<td align="center" style="background:#FF7200; opacity:.7;  filter:alpha(opacity=80)" onMouseOver="this.style.backgroundColor='#3366CC';this.style.cursor='hand';" onMouseOut="this.style.backgroundColor='#FF7200';">
							<font size="1" color="#FFF9F4"><b>UNO</b></font></td>
						</tr>
						<tr>
							<td align="center" style="background:#FF7200; opacity:.7;  filter:alpha(opacity=100)" onMouseOver="this.style.backgroundColor='#3366CC';this.style.cursor='hand';" onMouseOut="this.style.backgroundColor='#FF7200';">
							<font size="1" color="#FFF9F4"><b>DOS</b></font></td>
						</tr>
						</table>
				</div>
			<div style="position: absolute; width: 151px; left: 421px; top: 91px; float:left; z-index:205; height:76px; visibility:hidden" id="capa3" onMouseOver="document.getElementById('capa3').style.visibility='visible' ;this.style.cursor='hand';"  onMouseOut="document.getElementById('capa3').style.visibility='hidden' ;this.style.cursor='hand';" >
					<table border="0" width="100%" cellspacing="0" cellpadding="0">
						<tr>
							<td>&nbsp;</td>
						</tr>
					</table>
					<table border="1" width="151" cellspacing="0" cellpadding="0" bordercolor="#FFFFFF" bgcolor="#FFFFFF">
						<tr>
							<td align="center" style="background:#FF7200; opacity:.7;  filter:alpha(opacity=80)" onMouseOver="this.style.backgroundColor='#3366CC';this.style.cursor='hand';" onMouseOut="this.style.backgroundColor='#FF7200';">
							<font size="1" color="#FFF9F4"><b>UNO</b></font></td>
						</tr>
						<tr>
							<td align="center" style="background:#FF7200; opacity:.7;  filter:alpha(opacity=80)" onMouseOver="this.style.backgroundColor='#3366CC';this.style.cursor='hand';" onMouseOut="this.style.backgroundColor='#FF7200';">
							<font size="1" color="#FFF9F4"><b>DOS </b>
							</font><b><font size="1" color="#FFF9F4">&nbsp;</font></b></td>
						</tr>
						</table>
				</div>

</body>

</html>