pro-Gramas tu biblioteca de programacion
Tutoriales de Javascript
Introducción
Solo tienes que copear el código que esta abajo y si quieres puedes descargar el ejemplo funcionando al final.
<html>
<head>
<title>Menú parte superior 2</title>
<p align="center">
<br><br><br><b>Menú parte superior 2
<script>
if(document.layers)document.captureEvents(Event.MOUSEMOVE);
document.onmousemove=track;
divref=(document.all)?"":"document.";
stlref=(document.all)?"style.":"";
function track(e){
var x=(document.all)?event.x:e.pageX;
var y=(document.all)?event.y:e.pageY;
if(x<1||x>65||y<3||y>73)eval(divref+"b."+stlref+"visibility=hidden");
if(x<80||x>145||y<3||y>73)eval(divref+"c."+stlref+"visibility=hidden");
if(x<160||x>225||y<3||y>73)eval(divref+"d."+stlref+"visibility=hidden");
}
function reveal(menu){
eval(divref+menu+"."+stlref+"visibility=visible");
}
</script>
<STYLE TYPE="text/css">
BODY{color:black} A:link{color:white} A:visited{color:white} A:hover{color:red}
.bar{
color : white;
position : absolute;
left : 0;
top : 0px;
width : 780px;
height : 20px;
background : steelblue;
font-family : verdana;
font-size : 10pt;
border-color : white;
border-width : 1px;
}
.menu
{
position : absolute;
width : 65px;
height : 50px;
background : steelblue;
top : 21px;
visibility : hidden;
font-family : verdana;
font-size : 10pt;
border-color : white;
border-width : 1px;
}
</STYLE>
</head>
</b>
<body>
</p>
<DIV ID="a" CLASS="bar">
<A HREF="#" ONMOUSEOVER="reveal(b)"> Menu 1</A> |
<A HREF="#" ONMOUSEOVER="reveal(c)"> Menu 2</A> |
<A HREF="#" ONMOUSEOVER="reveal(d)"> Menu 3</A> |
</DIV>
<DIV ID="b" CLASS="menu" STYLE="left:0">
<A HREF="#"> Item 1-A </A>
<A HREF="#"> Item 1-B </A>
<A HREF="#"> Item 1-C </A>
</DIV>
<DIV ID="c" CLASS="menu" STYLE="left:80">
<A HREF="#"> Item 2-A </A>
<A HREF="#"> Item 2-B </A>
<A HREF="#"> Item 2-C </A>
</DIV>
<DIV ID="d" CLASS="menu" STYLE="left:160">
<A HREF="#"> Item 3-A </A>
<A HREF="#"> Item 3-B </A>
<A HREF="#"> Item 3-C </A>
</DIV>
</body>
</html>Autor: S/A
Descargar
Descargar