<!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>
<script language="javascript" type="text/javascript">
// Menu flotante by Peter-Paul Koch
// Pagina personal del autor:
http://www.xs4all.nl/~ppk/js/?version5.html
//
// Este script y otros muchos pueden
// descarse on-line de forma gratuita
// en El Código:
www.elcodigo.com
// numero de pixels de separacion con la parte superior de la ventana
var theTop = 30
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')
// obtiene si hay que mantenerlo fijo o moverlo, a partir del checkbox del propio menu
scrollIt = (document.layers) ?
document.menu.document.forms[0].elements[0].checked :
document.forms["capamenu"].elements[0].checked
// 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 += 30
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: 13px;
left: 9px;
font: 12px verdana,arial,helvetica;
color: #0000cc;
background: #eeee00;
padding: 10px;
border: none;
z-index: 5;
background-color: #CCCCCC;
}
/* :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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin título</title>
</head>
<body>
<p> </p>
<p> </p>
<p> </p>
<!-- Definicion del menu -->
<div id="menu">
<p><a href="index.php">Home</a><br>
<a href="http://localhost/html/modules.php?name=Stories_Archive">Noticias<br />
</a><a href="http://localhost/html/modules.php?name=Search">Buscar<br />
</a><a href="http://localhost/html/modules.php?name=Content">Contenido</a><br />
<a href="http://localhost/html/modules.php?name=Web_Links">Eventos</a><br />
<a href="http://localhost/html/modules.php?name=Feedback">Sugerencias</a></p>
<form name="capamenu">
<input type="checkbox" onClick="scrollIt = !scrollIt" checked>Flotante
</form>
</div>