- Mapas sensibles


Dada una imagen, dividirla por zonas, para que cada una de ellas sea un hiperenlace diferente.
Podemos ver, tanto la dimensión de la imagen, como las coordenadas en cualquier programa de retoque de imágenes.

1. Carga de la imagen y especificación de mapa.

<IMG SRC ="nom_imagen" usemap="#Map" border="0"> . Esta la situaremos en el lugar dónde deseemos que aparezca la imagen. El nexo de unión de la situación con el desarrollo del mapa es el nombre "usemap =#nombre"...

2. Especificar el nombre de mapa que nos referimos.
<map name="Map"> (El Map es el nombre que antes hemos especificado).

3. Poner las coordenadas de cada área, partiendo del punto superior izquierdo (0,0), y finalizando en el punto inferior derecho.

<area shape="rect" coords="1,2,98,201" href="Ejemplo.htm">
<area shape="rect" coords="99,2,222,203" href="Ejemplo.htm">

"rect" , nos indica que la forma de la sección es un rectángulo, (por tanto necesitamos definir dos puntos, el superior izquierdo y el inferior derecho).También pueden ser "circle, (coordenadas del centro y un punto del círculo), Oval, polígono (todos los puntos de delimitan al polígono)

4. poner la etiqueta de fin de mapa </MAP>

5. Podemos añadir un título, (que salga en un marco cuándo situamos el cursor por encima), añadiendo el argumento "title="Literal que ha de salir", después del hiperenlace. {punto 3}

6. También podemos establecer el tamaño de la imagen con HEIGHT y WIDHT, Así como el argumento.

BORDER. <IMG SRC ="nom_imagen" usemap="#Map" Height = 30 Widht = 40 border="0">

Clicar sobre el icono para ver un ejemplo: