Ver Mensaje Individual
  #3 (permalink)  
Antiguo 24/06/2009, 10:59
GabrielEnrique
 
Fecha de Ingreso: junio-2008
Mensajes: 47
Antigüedad: 16 años, 5 meses
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>