Oloblogger

Usando formularios para crear una lista de enlaces en poco espacio

Posted: 08 Mar 2011 06:45 AM PST

Esto no requiere demasiada explicación. Simplemente se trata de dar una idea para acortar esas interminables listas de enlaces que algunos tenemos, de manera que ocupen menos espacio en nuestra barra lateral... o dónde sea.

Para ello usaremos HTML y en concreto, el código necesario para construir un campo desplegable de un formulario. El código básico sería este:

<form name="formulario" method="post" action="">
<label>MIS SITIOS</label>
<select name="destinos">
<option value="http://google.es">Google</option>
<option value="http://youtube.com">YouTube</option>
<option value="http://gmail.com">GMail</option>
</select><input onclick="location.href=formulario.destinos.value;" type="button" value="IR" name="button">
</form>

Por cada nuevo enlace habría que añadir una nueva OPTION, con sus correspondientes etiquetas de apertura y cierre, incluyendo un VALUE igual a la dirección de destino. La etiqueta LABEL justo después de abrir el formulario, sólo contiene texto para servir de título sobre lo que el desplegable contiene. Se puede eliminar si se desea. El resultado sería este:

Notaréis que la etiqueta INPUT genera el botón que sirve para ir al enlace seleccionado. El texto del VALUE puede ser el que queráis (en el ejemplo "IR").

Pero también podríamos modificar un poco el código, para que se acceda al enlace sin necesidad del botón. Esto haría que fuéramos directamente a la dirección, nada más cambiar nuestra selección:

En este segundo caso, suprimiríamos el mencionado INPUT (botón "IR") y tendríamos que colocar un ONCHANGE en la etiqueta SELECT:

<form name="formulario2" method="post" action="">
<label>MIS SITIOS</label>
<select name="destinos2" onchange="location.href=formulario2.destinos2.value;">
<option value="http://google.es">Google</option>
<option value="http://youtube.com">YouTube</option>
<option value="http://gmail.com">GMail</option>
</select>
</form>