Menú fijo al hacer scroll

#1 (**permalink**) 26/02/2016, 17:15

Buenas, y gracias de ante mano.
Tengo hecho esta página toda con tablas e imágenes porque las diseño con el photoshop.

Cita:

<html>
<head>
<title>Herraagro - La herramienta de tu campo</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<table id="Table_01" width="1349" height="1101" border="0" cellpadding="0" cellspacing="0">
<tr>
<td>
<img src="images/index_01.jpg" width="175" height="42" alt=""></td>
<td>
<img src="images/index_02.jpg" width="236" height="42" alt=""></td>
<td>
<img src="images/index_03.jpg" width="25" height="42" alt=""></td>
<td colspan="2"><a href="iniciomedio.html" target="inicio"><img src="images/index_04.jpg" width="117" height="42" alt="" onMouseOver="this.src='images/index_04b.jpg';" onMouseOut="this.src='images/index_04.jpg';"></a></td>
<td>
<img src="images/index_05.jpg" width="25" height="42" alt=""></td>
<td><a href="herra.html" target="inicio"><img src="images/index_06.jpg" width="193" height="42" alt="" onMouseOver="this.src='images/index_06b.jpg';" onMouseOut="this.src='images/index_06.jpg';"></a></td>
<td>
<img src="images/index_07.jpg" width="26" height="42" alt=""></td>
<td colspan="2"><a href="informacion.html" target="inicio"><img src="images/index_08.jpg" width="176" height="42" alt="" onMouseOver="this.src='images/index_08b.jpg';" onMouseOut="this.src='images/index_08.jpg';"></a></td>
<td>
<img src="images/index_09.jpg" width="32" height="42" alt=""></td>
<td><a href="contacto.html" target="inicio"><img src="images/index_10.jpg" width="141" height="42" alt="" onMouseOver="this.src='images/index_10b.jpg';" onMouseOut="this.src='images/index_10.jpg';"></a></td>
<td colspan="2">
<img src="images/index_11.jpg" width="203" height="42" alt=""></td>
</tr>
<tr>
<td colspan="4">
<img src="images/index_12.jpg" width="538" height="134" alt=""></td>
<td colspan="5">
<img src="images/index_13.jpg" width="277" height="134" alt=""></td>
<td colspan="5">
<img src="images/index_14.jpg" width="534" height="134" alt=""></td>
</tr>
<tr>
<td>
<img src="images/index_15.jpg" width="175" height="820" alt=""></td>
<td colspan="12"><iframe name="inicio" frameborder="0" src="iniciomedio.html" width="1010" height="820"></iframe></td>
<td>
<img src="images/index_17.jpg" width="164" height="820" alt=""></td>
</tr>
<tr>
<td colspan="14">
<img src="images/index_18.jpg" width="1349" height="104" alt=""></td>
</tr>
<tr>
<td>
<img src="images/spacer.gif" width="175" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="236" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="25" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="102" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="15" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="25" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="193" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="26" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="18" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="158" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="32" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="141" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="39" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="164" height="1" alt=""></td>
</tr>
</table>

</body>
</html>

Y la idea es que la primer fila sea el menú fijo que no se mueva al hacer scroll. Estuve buscando tutoriales pero no le tomo la mano. ¿Alguno podría "tirarme un centro"? ¿Se puede hacer con tablas? ¿Y en este caso que es con imágenes y ya está hecho?
Les agradezco.
Saludos.

#2 (**permalink**) 26/02/2016, 19:44

Al momento encontré ésta solución:
<div style="position:fixed;top:0;"></div>

Pongo ese div a cada imagen y quedan fijas arriba. ¿Alguno cree que esto puede traer algun inconveniente?

Alexis88 · #3 (**permalink**) 26/02/2016, 22:13

Sería mejor que elabores el menú con otros elementos que no sean tablas puesto que las tablas solo deben usarse para listar datos. Por ejemplo, puedes usar un elemento de navegación <nav> o un elemento de lista desordenada <ul> conteniendo elementos de lista <li> en donde cada uno contendría a cada imagen; luego, solo tendrías que aplicar estilos para que tome la forma deseas y, finalmente, fijar una posición fija y arriba para todo el menú, como en el ejemplo que encontraste. Por ejemplo.

Un saludo