alguien sabe como hacer este menu???

slak · #1 (**permalink**) 20/01/2007, 17:41

que tal
no se mucho de javascript pero quisiera saber como hacer el menu de esta pagina (despues de elegir tu pais, por ejemplo mexico) http://www.infocus.com/Default.aspx

el menu al poner el puntero encima despliega hacia abajo submenus... alguien sabe como hacerlo o algun menu de este tipo que ya este prediseñado?

muchas gracias gente

bookmaster · #2 (**permalink**) 21/01/2007, 05:47

Eso que indicas es un simple elemento que se utiliza en los formularios, te dejo el ejemplo.

Código HTML:

<select name="NombreDelListado">
  <option value="Prueba1">Prueba 1</option>
  <option value="Prueba2">Prueba 2</option>
</select>

En el caso de que quieras que al seleccionarlo se vaya a otra página seria de la siguiente manera:

Código HTML:

<select name="NombreDelListado" onChange="location.href=this.value">
  <option value="paginauno.html">Pagina 1</option >
  <option value="paginados.html">Pagina 2</option >
  <option value="paginatres.html">Pagina 3</option >
</select >

slak · #3 (**permalink**) 21/01/2007, 19:11

xD
no me refiero a eso, me refiero al menu despues de que eliges tu pais, se va a la pagina principal y ahi sale el menu al que me refiero

NRLABS · #4 (**permalink**) 21/01/2007, 21:13

Es bonito pero no funciona en firefox bajo linux, al menos el flash se pone ensima de ese menu y no se ve.

Saludos

bookmaster · #5 (**permalink**) 22/01/2007, 09:12

No sabia que te referias al otro menu de dentro de la página.

Eso lo puedes hacer de la siguiente manera:

1º Crear los menu en diferentes tablas.
2º Meter las tablas en <DIV></DIV> y posicionarlas.
3º Darle nombre a los <DIV> y con javascript mover las capas.

Te pongo un pequeño ejemplo:

Código HTML:

<HTML>
   <HEAD>
      <TITLE>Menus desplegables</TITLE>
      <META HTTP-EQUIV="imagetoolbar" CONTENT="no">
<SCRIPT LANGUAGE="JavaSCript">
<!--
var Posicion=-100;
var PosicionHorizontal=-100;
var MenuActivo=0;
var TiempoMostrar=6000;
var TiempoMostrarHORI=2000;


// Menu1
function muestramenu(){
window.status="Estado del menu: "+MenuActivo+" Posicion vertical: "+Posicion+" Posicion horizontal: "+PosicionHorizontal;
	if (Posicion<=30){
		Posicion = Posicion + 1;
		Menu1.style.visibility="visible";
		Menu1.style.top=Posicion;
		setTimeout('muestramenu()',10);
	};

	if ((Posicion>=30)&&(MenuActivo==0)){
		setTimeout('recogemenu()',TiempoMostrar);
	};

};

function recogemenu(){
window.status="Estado del menu: "+MenuActivo+" Posicion vertical: "+Posicion+" Posicion horizontal: "+PosicionHorizontal;
	if(Posicion==-100){
		Menu1.style.visibility="hidden";
	} else {
		Posicion=Posicion-1;
		Menu1.style.top=Posicion;
		setTimeout('recogemenu()',10);
	};
};
//-->

-->
</SCRIPT>


   </HEAD>
   <BODY topmargin="0" rightmargin="0" rightmargin="0" leftmargin="0" marginwidth="0" marginheight="0">

<TABLE WIDTH="300" BORDER="1">
<TR><TD width="100" onmouseover="muestramenu(); MenuActivo=1;" onmouseout="MenuActivo=0">Opcion1</TD>
<TD width="100" onclick="muestramenu2();" onmouseover="MenuActivo=0;" onmouseout="MenuActivo=0">Opcion2</TD>
<TD width="100" onclick="muestramenu3();" onmouseover="MenuActivo=0;" onmouseout="MenuActivo=0">Opcion3</TD></TR>
</TABLE>

<DIV ID="Menu1" style="position:absolute; left:0; top:0; visibility:hidden;">
<TABLE width="100" BORDER="1">
<TR><TD onmouseover="MenuActivo=1" onmouseout="MenuActivo=0">Opcion11</TD></TR>
<TR><TD onmouseover="MenuActivo=1" onmouseout="MenuActivo=0">Opcion21</TD></TR>
<TR><TD onmouseover="MenuActivo=1" onmouseout="MenuActivo=0">Opcion31</TD></TR>
</TABLE>
</DIV>
<DIV ID="Menu2" style="position:absolute; left:-100; top:30; visibility:hidden;">
<TABLE width="100" BORDER="1">
<TR><TD onmouseover="MenuActivo=1" onmouseout="MenuActivo=0">Opcion12</TD></TR>
<TR><TD onmouseover="MenuActivo=1" onmouseout="MenuActivo=0">Opcion22</TD></TR>
<TR><TD onmouseover="MenuActivo=1" onmouseout="MenuActivo=0">Opcion32</TD></TR>
</TABLE>
</DIV>

   </BODY>
</HTML>

No esta terminado del todo pero es para que te hagas una idea.