Oi gente!
O tutorial de hoje é de como mapear/linkar imagens.
Ou seja, ao clicar nela, ou em um pedaço nela, ser redirecionado para algum link.
MAPEANDO UMA IMAGEM
Ao entrar no site...
Clique na imagem para ampliá-la.
1: Cole a URL de alguma imagem
OU
2: Busque a imagem no seu computador.
Depois de selecionar a imagem...
Clique na imagem para ampliá-la.
3: Clique em "Start Mapping" para começar a mapear.
Clique na imagem para ampliá-la.
4: Confirme a imagem clicando em em "continue".
Clique na imagem para ampliá-la.
5: Clique em "close" para começar a mapear.
Clique na imagem ara ampliá-la.
6: Clique com o botão direto do mouse e escolha uma opção para
selecionar a parte da imagem a ser mapeada/linkada.
Create Rect: Selecionar com retângulo.
Create Poly: Selecionar com riscos abstratos.
Create Circle: Selecionar com círculo.
Clique na imagem para ampliá-la.
7: Seleção em retângulo. (Create Rect)
8: MAP URL: URL a ser redirecionado ao clicar na parte
mapeada/linkada da imagem.
9: Title: Nome que aparecerá ao colocar a seta sobre a parte
mapeada/linkada.
Clique na imagem para ampliá-la.
Quadrado vermelho: Parte mapeada.
10: Clique em "Get Code" ara gerar o código HTML da imagem mapeada.
Abrirá uma janela do lado direito da tela.
Clique na imagem ara ampliá-la.
Clique na aba "HTML Code".
Clique na imagem para ampliá-la.
Este é o código HTML da imagem mapeada.
Copie-o e cole onde quiser.
(HTML do seu blog, Site, Post do blog...)
Esperamos que gostem.
OBS: Se copiar este post e colar no seu site, dê os devidos créditos.(Imagem e texto)
Best Tutoriais
quinta-feira, 4 de setembro de 2014