<map>

Mapeamento de Imagem no Lado do Cliente

Definição:

A tag <map> vem do inglês map e significa mapa.

Esta tag é usada em conjunção com as tags <area> e <img> para permitir que imagens sejam mapeadas em diferentes links.

Suporte:

Netscape: 2.0
Internet Explorer: 2.0
Aceito nas especificações DTD: Estrito, Transicional e Frameset

Dicas:

A associação entre um mapemento e a figura é feito através do atributo usemap da tag <img>.

Mapementos também podem ser associados às tags <object>  e <input>.

Alguns navegadores antigos interpretam o valor do atributo id como sendo o nome do mapeamento.

Exemplo:

Código Resultado

Clique no Quadro ou no Telefone:<br />
<p><map name="mapa">
<area href="/images/quadro.jpg" shape="polygon" coords="84, 140, 87, 22, 179, 27, 171, 145" target="_blank" />
<area href="/images/telefone.jpg" shape="polygon" coords="67, 76, 67, 18, 27, 18, 29, 71, 25, 76, 22, 131, 30, 142, 36, 136, 41, 112, 36, 80, 38, 76" target="_blank" />
</map>
<img border="0" src="/images/parede.jpg" usemap="#mapa" /></p>

Clique no Quadro ou no Telefone:

Atributos Padrão:

class, dir, id, lang, styletitle

Atributo Obrigatório:

Atributo Valor Descrição
name name Especifica um nome único para o mapeamento da figura.

Eventos Associados:

onclick, ondblclick, onkeydown, onkeypress, onkeyup, onmousedown, onmousemove, onmouseout, onmouseover, onmouseup