| Sección
"Java Scripts" |
|
Lección
54 |
Menú
estático
Este
Script permite crear un menú que acompaña al
Scroll (el botón de desplazamiento) de la página.
Para
lograr este efecto pegas este Script en cualquier
sector de tu sitio, pero siempre debajo de donde
dice <Body> en el HTML de tu página:
| <body
OnLoad="setVariables();checkLocation()"> |
Ahora
pegas también este Script en cualquier sector de
tu sitio, pero siempre debajo de donde dice <Body>
en el HTML de tu página:
<script
LANGUAGE="JavaScript">
function setVariables() {
if (navigator.appName == "Netscape")
{
v=".top=";
dS="document.";
sD="";
y="window.pageYOffset";
}
else {
v=".pixelTop=";
dS="";
sD=".style";
y="document.body.scrollTop";
}
}
function checkLocation() {
object="object1";
yy=eval(y);
eval(dS+object+sD+v+yy);
setTimeout("checkLocation()",10);
}
</script> |
Finalmente
armamos el menú, y lo pegas en cualquier sector
de tu sitio, pero siempre debajo de donde dice
<Body> en el HTML de tu página::
| <div
id="object1" style="position:relative;
visibility:show; left:0px; top:0px;
z-index:5"><div
align="right">
<table
width="120" border="0"
bgcolor="#BCBCBC"
cellspacing="1">
<tr>
<td
bgcolor="#000000"><p
align="center"><font
face="Arial"
color="#FFFFFF"><strong><small>Menu
Estático</small></strong></font></td>
</tr>
<tr>
<td
bgcolor="#EAEAEA" align="center"><table
border="0" width="100%"
cellpadding="0">
<tr>
<td
width="100%"></td>
</tr>
</table>
</td>
</tr>
<tr>
<td
bgcolor="#EAEAEA" align="center"><a
href="http://webgasoleros.netfirms.com">Webgasoleros</a></td>
</tr>
<tr>
<td
bgcolor="#EAEAEA" align="center"><a
href="http://www.forosdelweb.com">Foros
del Web</a></td>
</tr>
<tr>
<td
bgcolor="#EAEAEA" align="center"><a
href="http://www.desarrolloweb.com">DesarrolloWeb</a></td>
</tr>
<tr>
<td
bgcolor="#EAEAEA" align="center"><a
href="http://www.efax.com">Efax</a></td>
</tr>
</table>
</div> |
|
Lo
que pinté con rojo es el título que aparecerá
en cada enlace.
Lo
que coloreé de azul corresponde a la dirección
donde dirige cada enlace.
Con
verde pinté el título que saldrá en el menú
estático.
Aquí
copio nuevamente el código con opción para
seleccionarlo, cortar y pegar en tu sitio.
Para
ello haces click en cualquier palabra que se halla
dentro de la caja, Te diriges a "Edición"
en el menú superior de la barra de herramientas,
e indicas "Seleccinar todo", luego tomas
lo seleccionado dirigiéndote nuevamente a
"Edición", pero esta vez indicas
"Cortar", y posteriormente te posicionas
en tu página, donde quieres colocar este código,
entonces te diriges a Edición, y le indicas
"Pegar".
Si
deseas hacer las cosas más rápido, puedes
verificar en "Edición" (está escrito
al lado de las palabras que indican cada orden)
que pulsando "Control" + una letra
determinada, puedes "seleccionar todo",
"cortar" o "pegar" en forma
instantánea y con eso evitas tener que ingresar
constantemente al menú de "Edición".
Esto
es lo que primero debes pegar debajo de donde dice
<Body>
en el HTML de tu página:
Esto
es lo segundo que debes pegar debajo de donde dice
<Body>
en el HTML de tu página:
Esto
es lo tercero que debes pegar debajo de donde dice
<Body>
en el HTML de tu página:
Si
de todos modos, no funciona este efecto, corta
el código HTML que debes colocar en tu página,
pero antes de hacerlo, pégalo en tu Block de
notas, y luego si córtalo de allí y pégalo en
tu sitio. Ahora si no creo que haya ningún
inconveniente que te impida disfrutar de este
bonito efecto.
Recordemos
que este Script también puede ser hallado en el
programa Depósito, el cual puedes bajar de aquí:
webtutorial.com.ar
| 
