andrewriojano85
Usuario Novato
Usuario Novato

Hola os escribo porque he estado intentando realizar una lista desplegable con enlaces, pero no consigo que tire, estaba usando hasta ahora haciendo uso de un botón y con ello me funcionaba pero como el botón se acaba cargando la estática de la página pos pensé que lo intentaría realizar sin el uso del evento, encontré en este mismo foro un mensaje hablando sobre la posible utilización de este evento sobre la lista enlazable, pero en mi caso no funciona y la verdad es que no se por qué. Os pongo a continuación el código:

 

<DIV class="nivel_2"><select name="listaMesesTramit" size="1" onChange = "document.getElementById('enlaceMesTramit').href=this.form.listaMesesTramit.options[this.form.listaMesesTramit.selectedIndex].value" style="font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 8 pt">
 <option value="Seguimiento%20Mensual/Historico/Abril2010_Valido/12_1_2011/index.htm">Abril-12/01/2011</option>
 <option value="Seguimiento%20Mensual/Historico/Abril2010_Valido/13_1_2011/index.htm">Abril-13/01/2011</option><option value="Seguimiento%20Mensual/Historico/Diciembre2010_Valido/12_1_2011/index.htm">Diciembre-12/01/2011</option>
 <option value="Seguimiento%20Mensual/Historico/Diciembre2010_Valido/13_1_2011/index.htm">Diciembre-13/01/2011</option><option value="Seguimiento%20Mensual/Historico/Septiembre2010_Valido/12_1_2011/index.htm">Septiembre-12/01/2011</option>
 <option value="Seguimiento%20Mensual/Historico/Septiembre2010_Valido/13_1_2011/index.htm">Septiembre-13/01/2011</option>
 </select></selecciona></font></div>
 <a href="#" id= "enlaceMesTramit"></a></font></DIV>

¿Sabéis que podría estar mal? Tampoco he podido usar más el buscador más porque me estoy conectando con el móvil :S.

Un saludo y gracias

Avatar Image
Usuario habitual
Usuario habitual

Espero que este te sirva, solo tienes que modificar los links y los colores a tu gusto. esto es css asi que ponlo dentro de sus respectivas etiquetas <style></style>.

Y esta es la lista desplegable. dentro de <body></body>.

<ul id="menu">
<li><a class="selected" tihref="#">Inicio</a></li>
<li><a href="#">Contacto</a>
<ul>
<li><a href="#">Webmaster</a></li>
<li><a href="#">Administrador</a></li>
</ul>
</li>
<li><a href="#">Localización</a></li>
<li><a href="#">Contacto</a></li>
</ul>

Spoiler:
body{
background:#fff;
}

/* Root = Horizontal, Secondary = Vertical */
ul#menu {
ba
margin: 0;
border: 0 none;
padding: 0;
/* width: 500px;*/ /*For KHTML*/
width:360px;
list-style: none;
height: 20px;
border:1px solid #eee;
padding-bottom:5px;
}

ul#menu li {
margin: 0;
border: 0 none;
padding: 0;
float: left; /*For Gecko*/
display: inline;
list-style: none;
position: relative;
height: 20px;
}
ul#menu li{
padding-bottom:5px;
}
ul#menu li:hover{
background:#ddd;
}

ul#menu ul {
margin: 0;
border: 0 none;
padding: 0;
width: 160px;
list-style: none;
display: none;
position: absolute;
top: 25px;
left: 10px;
background: #eee;
border: none;
opacity: 0.8;
-moz-opacity: 0.8;
filter:alpha(opacity=80);
}

ul#menu ul:after /*From IE 7 lack of compliance*/{
clear: both;
display: block;
font: 1px/0px serif;
content: ".";
height: 0;
visibility: hidden;
}

ul#menu ul li {
width: 160px;
float: left; /*For IE 7 lack of compliance*/
display: block !important;
display: inline; /*For IE*/
}

/* Root Menu */
ul#menu a {
padding: 5px 15px 5px;
float: none !important; /*For Opera*/
float: left; /*For IE*/
display: block;
color: #9fcf21;
text-decoration: none;
font-weight: bold;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
font-weight:bold;
/* border-right:1px solid #818181;*/
text-decoration: none;
height: auto !important;
height: 1%; /*For IE*/
}

/* Root Menu Hover Persistence */
ul#menu a:hover,
ul#menu li:hover a,
ul#menu li.iehover a {
color: #003300;

}

/* 2nd Menu */
ul#menu li:hover li a,
ul#menu li.iehover li a {
float: none;
border:none;
}

/* 2nd Menu Hover Persistence */
ul#menu li:hover li a:hover,
ul#menu li:hover li:hover a,
ul#menu li.iehover li a:hover,
ul#menu li.iehover li.iehover a {
background:#ddd;
color: #003300;
}

/* 3rd Menu */
ul#menu li:hover li:hover li a,
ul#menu li.iehover li.iehover li a {
background: #EEE;
color: #666;
}

/* 3rd Menu Hover Persistence */

ul#menu li:hover li:hover li a:hover,
ul#menu li:hover li:hover li:hover a,
ul#menu li.iehover li.iehover li a:hover,
ul#menu li.iehover li.iehover li.iehover a {
background:#ddd;
color: #FFF;
}

/* 4th Menu */
ul#menu li:hover li:hover li:hover li a,
ul#menu li.iehover li.iehover li.iehover li a {
background:#ddd;
color: #666;
}

/* 4th Menu Hover */
ul#menu li:hover li:hover li:hover li a:hover,
ul#menu li.iehover li.iehover li.iehover li a:hover {
background: #CCC;
color: #FFF;
}

ul#menu ul ul,
ul#menu ul ul ul {
display: none;
position: absolute;
top: 0;
left: 160px;
}

/* Do Not Move - Must Come Before display:block for Gecko */
ul#menu li:hover ul ul,
ul#menu li:hover ul ul ul,
ul#menu li.iehover ul ul,
ul#menu li.iehover ul ul ul {
display: none;
}

ul#menu li:hover ul,
ul#menu ul li:hover ul,
ul#menu ul ul li:hover ul,
ul#menu li.iehover ul,
ul#menu ul li.iehover ul,
ul#menu ul ul li.iehover ul {
display: block;
}
ul#menu .selected{
color: #003300;
}
Jwilches15
Usuario Novato
Usuario Novato

aluien me puede ayudar con el codigo de una lista plegable

plissssssssssssssssssssssssssssssssssss

ATENCIÓN: Este tema no tiene actividad desde hace más de 6 MESES,
te recomendamos abrir un nuevo tema en lugar de responder al actual
Opciones:
Ir al subforo:
Permisos:
TU NO PUEDES Escribir nuevos temas
TU NO PUEDES Responder a los temas
TU NO PUEDES Editar tus propios mensajes
TU NO PUEDES Borrar tus propios mensajes
Temas similares
TemaUsuariosRespuestasVisitasActividad
Por: , el 16/Feb/2006, 19:54
Sabatski EffectedCard NoSetup.org cchaparro448kFeb/07
Por: , el 17/Nov/2010, 20:41
fb@100000182297840 GestionXls 100x100net chavp43kNov/10
Por: , el 22/Jun/2009, 18:12
pruevaselvakilla GestionXls27kJun/09