Oh oh, ya me respondí solita.
Debo decir que no es lo mismo que ustedes pero que es una buena solución: menú sígueme.
Les dejo el código por si les sirve, aunque cabe decir que no lo hice yo, sino que lo encontré en otro lugar y lo adapté:
Código HTML:
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Temasis</title>
<script language="javascript" type="text/javascript">
// numero de pixels de separacion con la parte superior de la ventana
var theTop = 250
var menu, scrollIt
// posicion actual
var old = theTop
// a true, la posición del menu se mantiene a "theTop" pixels, aunque se desplace la pagina verticalmente
// a false, el menu es fijo
var scrollIt = true
// INICIALIZACION
function init() {
// obtiene referencia al objeto con el menu
menu = new getObj('menu')
// inicia el proceso que mantiene la posicion a "theTop" pixels
movemenu()
}
//MOVIMIENTO
function movemenu() {
if (scrollIt) {
if (window.innerHeight) {
pos = window.pageYOffset
} else if (document.documentElement && document.documentElement.scrollTop) {
pos = document.documentElement.scrollTop
} else if (document.body) {
pos = document.body.scrollTop
}
if (pos < theTop)
pos = theTop
else
pos += 250
if (pos == old)
menu.style.top = pos + 'px'
old = pos
}
moveID = setTimeout('movemenu()',200)
}
//OBTENCION DE REFERENCIA AL OBJETO
function getObj(name) {
// si soporta DOM Lelvel 2
if (document.getElementById) {
this.obj = document.getElementById(name)
this.style = document.getElementById(name).style
// si soporta el DOM del IE4.x
} else if (document.all) {
this.obj = document.all[name]
this.style = document.all[name].style
// si soporta el DOM del N4.x
} else if (document.layers) {
this.obj = document.layers[name]
this.style = document.layers[name]
}
}
window.onload = init
if (document.captureEvents) { //N4 requiere invocar la funcion captureEvents
document.captureEvents(Event.LOAD)
}
</script>
<style TYPE="text/css">
#menu {
position: absolute;
top: 300px;
left: 1%;
font:
color: #0000cc;
background: ;
padding: 10px;
border: none;
z-index: 5;
font-weight: bold;
}
/* :visited es necesario porque el menu contiene enlaces internos (#) y el IE los ve como ya visitados */
div#menu a, div#menu a:visited {
color: #0000cc;
}
</style>
<style>
body {
background-color: ;
text-align: left;
}
.boton { color: #7900B2;
font-style: italic;
font-size: 12px;
font-family: Tahoma, Geneva, sans-serif;
background-color: #FFF;
}
.texto {
font-style: normal;
}
texto {
font-family: Tahoma, Geneva, sans-serif;
}
.control table tr td table tr td {
}
</style>
</head>
<body class="control">
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="130"> </td>
</tr>
<tr>
<td height="100" valign="top"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<th width="250" valign="top" scope="col"><p>
<!-- Definicion del menu -->
</p>
<div id="menu">
<a href="Carpetas_Escritorio/Rosy Rmz/Temasis/Sitio/Temasis/sitio/sistemas2.html" style="color:#00f1ee;"> </a><a style="color:#00f1ee;" href="Carpetas_Escritorio/Rosy Rmz/Temasis/Sitio/Temasis/sitio/sistemas1.html"> </a><a style="color:#000; font-weight: normal;" href="Carpetas_Escritorio/Rosy Rmz/Temasis/Sitio/Temasis/sitio/sistemas1.html">
<h8><font face="Symbol">></font></h8>
<h7>Sub1</h7>
</a><br>
<a style="color:#00f1ee; font-weight: normal;" href="Carpetas_Escritorio/Rosy Rmz/Temasis/Sitio/Temasis/sitio/sistemas2.html">
<h8><font face="Symbol">></font></h8>
<h7>Sub1</h7>
</a><a href="http://www.elcodigo.com/herramientas/herramientas.html"></a><br>
<a style="color:#000; font-weight: normal;" href="Carpetas_Escritorio/Rosy Rmz/Temasis/Sitio/Temasis/sitio/sistemas3.html">
<h8><font face="Symbol">></font></h8>
<h7>Sub1</h7>
</a><br>
<a style="color:#000; font-weight: normal;" href="Carpetas_Escritorio/Rosy Rmz/Temasis/Sitio/Temasis/sitio/sistemas4.html">
<h8><font face="Symbol">></font></h8>
<h7>Sub1</h7>
</a> <br>
</div>
</th>
<td width="500"><p>Dale enters para ver cómo se desplaza.</p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p>´p´+´</p>
<p> </p>
<p> </p></td>
<td width="187"> </td>
</tr>
<tr>
<th valign="top" scope="col"> </th>
<td><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<th width="520" scope="col"><span style="font-size: 9px; font-family: Tahoma, Geneva, sans-serif; font-style: italic; color: #333; font-weight: normal;">opóip´po´po</span></th>
<th scope="col"> </th>
</tr>
</table></td>
<td> </td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>