• HTML - Atributos -

  coords

Este atributo esta relacionado a tag <area> que específica a posição da seleção sobre a imagem. A quantidade de valores das coordenadas depende da forma geométrica que pretende construir, são elas:

rect: x, y, x1, y1 (x e y especifica um ponto inicial do retângulo cujo x é o espaçamento esquerdo e y o espaçamento superior. X1 e y1 cria o segundo ponto que uni o segmento para a formação do retângulo, x1 e y1 também tem as mesmas características de espaçamento que o x e y, por isso deve atentar-se em não criar x1 e y1 com valores menores que x e y, veja o exemplo abaixo).

* Exemplo de coordenadas para rect.

<map id="planetamap" name="planetamap">
   <area shape="rect" coords="10,10,60,60" href="#" target="_blank"/>  
</map>

circle: x, y, z (x e y especifica o espaçamento esquerdo e superior respectivamente a partir do ponto central do circulo. Z é o tamanho do raio, é o que vai determinar o tamanho do arco do circulo).

* Exemplo de coordenadas para circle.

<map id="planetamap" name="planetamap">
   <area shape="circle" coords="35,35,25" href="#" target="_blank"/>
</map>

poly: x, y, x1, y1, x2, y2..., xn, yn (as coordenadas poly funciona da mesma forma que rect só que você pode especificar quantos pontos quiser para formar o seu polígono.

* Exemplo de coordenadas para poly.

<map id="planetamap" name="planetamap">
   <area shape="poly" coords="10,10,70,10,40,60" href="#" target="_blank"/>
</map>