1. TugaTech » Programação, Scripts e Webmasters » Tutoriais e Dicas
Siga-nos

Realize o Login na sua conta ou Registe-se para participar.

Ver o tópico anterior Ver o tópico seguinte Ir para baixo  Mensagem [Página 1 de 1]

#1[Tutorial] Coords - HTML Empty [Tutorial] Coords - HTML - Dom 2 Jan 2011 - 3:05

Daniel Mendes

Super-membro
Daniel Mendes
Neste tutorial usarei o photoscape, pois é um programa bastante simples e fácil para este tutorial. Podes usar paint, photoshop ou outros...

Para que servem estes códigos? Parece um quebra-cabeças mas é bastante simples. Se tens uma imagem com por exemplo a dizer "Links, Contactos, etc" come stes códigos numa só imagem podes colocar vários links (daí eu dizer o tutorial para repetirem múltiplas vezes o interior caso queiram mais links).

1. Abres a imagem que queres:



Repara que na parte de baixo está as coordenadas do sitio onde está o cursor do rato.

2. Queres as coordenadas (coords) para o código, logo terás de colocar o cursor do rato mesmo no sitio onde queres que fique o inicio da coordenada:



No canto superior esquerdo (do corte) tens a coordenada. Agora já tens um começo para o teu código. Logo agora queres o final da coordenada que veremos isso no ponto 3.

A coord inicial é: 17,320

3. Para saber a coordenada final basta fazeres o mesmo processo:



A coord final é: 979,491

4. Chegamos à parte do código, que será:



Forneço o código via bloco de notas alojado no MediaFire pois a Blogger não aceita códigos HTML nos tópicos o que é um pouco absurdo --'

http://www.mediafire.com/?dyheu485lxe7c74

Caso queira várias coords dentro da mesma imagem/código basta multiplicar quantas vezes as que quiseres a parte de dentro do código:




Basta apagar os 000's e colocar os números que usamos acima (as coordenadas).


Espero que seja útil.. Não se esqueçam de comentar. Qualquer dúvida basta responderem no tópico!

Totalmente criado por Daniel Mendes (eu)

cheers



Última edição por Daniel Mendes em Dom 2 Jan 2011 - 16:12, editado 1 vez(es)

http://www.dusttbox.com https://www.facebook.com/www.facebook.com/zerokj skkzero

#2[Tutorial] Coords - HTML Empty Re: [Tutorial] Coords - HTML - Dom 2 Jan 2011 - 11:28

DJPRMF

Administrador
DJPRMF
Uma coisa, e para que serve colocar essas coordenadas?

Cumps


____________________________________________

[Tutorial] Coords - HTML Tugatechuserbar
[Tutorial] Coords - HTML 3
[Tutorial] Coords - HTML 2
TugaTech || Host TugaTech
https://tugatech.com.pt https://www.facebook.com/DJPRMF https://twitter.com/dj_prmf DJPRMF

#3[Tutorial] Coords - HTML Empty Re: [Tutorial] Coords - HTML - Dom 2 Jan 2011 - 12:46

Shaxine

Moderador
Shaxine
Bem eu já percebi mas apesar de nem toda a gente ficar a perceber pois não está explicito no post.
isso serve para que numa imagem possas definir áreas especificas da mesma onde poder por exemplo meter um link.
Aconselho-te a meter isso mais explicito pois esta tudo muito bem explicado como se faz e tal, mas não para que serve. Razz

#4[Tutorial] Coords - HTML Empty Re: [Tutorial] Coords - HTML - Dom 2 Jan 2011 - 13:08

DJPRMF

Administrador
DJPRMF
Tonito1 escreveu:Bem eu já percebi mas apesar de nem toda a gente ficar a perceber pois não está explicito no post.
isso serve para que numa imagem possas definir áreas especificas da mesma onde poder por exemplo meter um link.
Aconselho-te a meter isso mais explicito pois esta tudo muito bem explicado como se faz e tal, mas não para que serve. Razz

Obrigado, já entendi... Very Happy

realmente não está muito explicito no tópico. Wink
Mas não deixa de ser uma boa dica. Desconhecia, mas será-me útil. Very Happy

Thanks. Very Happy


____________________________________________

[Tutorial] Coords - HTML Tugatechuserbar
[Tutorial] Coords - HTML 3
[Tutorial] Coords - HTML 2
TugaTech || Host TugaTech
https://tugatech.com.pt https://www.facebook.com/DJPRMF https://twitter.com/dj_prmf DJPRMF

#5[Tutorial] Coords - HTML Empty Re: [Tutorial] Coords - HTML - Dom 2 Jan 2011 - 16:01

Convidado

Convidado
Anonymous
Ola bom tutorial,

Eu nunca uso isso posso fazer online, vou partilhar aqui um site para os que não conheçem: http://www.image-maps.com/

#6[Tutorial] Coords - HTML Empty Re: [Tutorial] Coords - HTML - Dom 2 Jan 2011 - 16:05

Daniel Mendes

Super-membro
Daniel Mendes
Olá a todos,

Peço desculpa por não ter sido explícito no tema, mas pensei que toda a gente soubesse o que era e como não é costume ver muitos tutoriais a falar sobre isto decidi criar.

Eu usei isto algumas vezes para blog's de amigos e afins.

É bastante simples embora pareça um quebra-cabeças. Com este código dá para definires um link ou mais links numa só imagem. (vou editar o tópico)

Obrigado FlashVitor ^^

http://www.dusttbox.com https://www.facebook.com/www.facebook.com/zerokj skkzero

#7[Tutorial] Coords - HTML Empty Re: [Tutorial] Coords - HTML - Dom 2 Jan 2011 - 16:07

Shaxine

Moderador
Shaxine
FlashVitor escreveu:Ola bom tutorial,

Eu nunca uso isso posso fazer online, vou partilhar aqui um site para os que não conheçem: http://www.image-maps.com/
Muito Bom!
Com esse site fica mais fácil em pouco tempo temos o código pronto para usar. Wink

#8[Tutorial] Coords - HTML Empty Re: [Tutorial] Coords - HTML - Dom 2 Jan 2011 - 16:20

Daniel Mendes

Super-membro
Daniel Mendes
Tópico editado.

Obrigado pela dica pessoal Smile

http://www.dusttbox.com https://www.facebook.com/www.facebook.com/zerokj skkzero

#9[Tutorial] Coords - HTML Empty Re: [Tutorial] Coords - HTML - Ter 18 Out 2011 - 23:43

celsinho05

Técnico
celsinho05
Por acaso já conhecia as imagens com map, mas só conhecia a versão do Dave Mustaine, obrigado por compartilhares a tua FlashVitor Wink

https://www.facebook.com/celsinho05

Ver o tópico anterior Ver o tópico seguinte Ir para o topo  Mensagem [Página 1 de 1]

Permissões neste sub-fórum
Não podes responder a tópicos




Aplicações do TugaTechAplicações TugaTechDiscord do TugaTechDiscord do TugaTechRSS TugaTechRSS do TugaTechSpeedtest TugaTechSpeedtest TugatechHost TugaTechHost TugaTech