Revista Informática

HTML - Lista desplegable con enlaces

Publicado el 20 septiembre 2014 por Francves

HTML - Lista desplegable con enlaces
Sí queremos colocar una larga lista de enlaces en nuestro sitio web, una buena idea es hacer una lista desplegable en html, con la cual al elegir una opción y hacer clic en un botón de "ir" podamos abrir dicho enlace.
Para ello copiaremos y pegaremos el siguiente código en nuestro sitio web:
<center><form name="link"><select name="menu">
<option selected="selected">Elige un enlace</option>
<option value="http://tuenlace.com">Primer enlace</option>
<option value="http://tuenlace.com">Segundo enlace</option>
<option value="http://tuenlace.com">Tercer enlace</option>
</select>  <input onclick="location=document.link.menu.options[document.link.menu.selectedIndex].value;" type="button" value="Ir" /><span style="line-height: 1.3em;"> </span></form></center>

Solo debemos editar las líneas que se refieren a los enlaces, "primer enlace" lo cambiaremos por el texto que queremos muestre para dicha opción, y http://tuenlace.com lo cambiaremos por el enlace a donde queremos ser dirigidos.
A continuación se muestra un ejemplo de esta lista desplegable:
Elige un enlaceProgramacionLinuxSocial MediaEbooksCursos OnlineTutoriales

Sí queremos agregar más opciones solo debemos agregar una linea con la etiqueta option

<option value="http://tuenlace.com">Agregar otro enlace</option>

También te podría interesar:
  1. Curso Online Introducción al HTML y CSS
  2. Curso Online Bases de HTML5
  3. Curso online Cómo Programar para Emprendedores - HTML y CSS
  4. Arrastrar elementos html con jQuery UI + mini juego rompecabezas.


Volver a la Portada de Logo Paperblog