Jump to content
Fórum Script Brasil
  • 0

Abrir link da foto na mesma aba, o que está errado? (RESOLVIDO)

kauecast

Asked by kauecast,

 Share

Question

kauecast

kauecast

Posted
Posted (edited)

Montei uma apresentação de slide para por no site, até ai tudo ok.

O problema veio na hora de por o link na foto do slide, por exemplo, cada foto que passa no slide vai ter um link que desvia para uma área específica do site.

Eu consegui por o link na foto. O problema é que ele estava abrindo a página na mesma área da foto, dentro da foto.

O código que coloquei abaixo é para abrir o link em uma nova aba(deixei assim já que estava abrindo na foto).

O que quero fazer é o que acontece na maioria dos sites, você clica na foto e ele desvia para a página específica dentro pro próprio site, simplesmente muda o conteúdo da aba. Como que eu faço para que abra o link na mesma aba? e não em outra?

<a href="https://sites.google.com/site/golacocomercioferroeaco/forjados-1" target="parent"><img src="https://sites.google.com/site/golacocomercioferroeaco/gate.jpg" alt="Third Image" title="Acesse" border="none" /></a>

Será que alguém sabe o que deu errado?

valeu!

Edit: um exemplo ilustrado:

semttulouag.jpg

Esse é o slide que está na página inicial do site, ao clicar nesta foto gostaria que na mesma aba abrisse a página referente. porém olhem o que estava acontecendo:

siteerrado.jpg

Notem que bem ao centro onde está escrito serralheria artistica é a área da foto na página principal. Gostaria que abrisse na página toda e não na foto.

Repito que o código que forneci está alterado para que abra em uma nova janela...

Edited by kauecast
Link to comment
Share on other sites

8 answers to this question

Recommended Posts

  • 0
atkins

atkins

Posted
Posted

AAAAAHHH Agr eu te entendi hehe.... Malz ai pelo pedido, é porque pra poder te responder certinho eu prefiro acabar pedindo um pouco mais de detalhes....

Cara na verdade eu vou lhe dar outra sugestão, eu sei um método que voce coloca quadrados, circulos ou até desenha aquela arvore ali( se você tiver paciencia hehe) invisivel, ai o cara passa o mouse por cima da foto e vai apareceno que tem links, aquela luvinha estranha, saca?? Porém, se você não gostar, eu vou lhe dar a resposta simples e rapida de como resolver isso...

bora então...

Primeiro vou te mostrar como fazer os negocios invisivel...

<body>

<p style="align:center;">

<img src="imagem1.jpg" usemap="#imagem1" alt="Ilha deserta" />

<map name="imagem1">

<area shape="rect" coords="65,100,395,310" href="nuvem.html" alt="Nuvem" />

<area shape="circle" coords="750, 535,30" href="areia.html" alt="Areia" />

<area shape="poly" coords="720,215,610,305,685,365,430,530,490,545,690,415,835,320" href="coqueiro.html" alt="Coqueiro" />

</map>

</p>

</body>

O <p> na segunda linha foi um método que preferi colocar a foto, não curto muito divs, mas fique a vontade...

<img scr="DIRETÓRIO DA FOTO" usemap="AQUI É UM NOME PARA O MAP LOGO ABAIXO SABER QUAL IMAGEM ELE DEVE USAR..." alt="quando A FOTO NÃO APARECE" />

O <map name=""> abri o seu mapa da foto, ele vai lhe permitir desenhar links dentro da sua foto sem alterar a integridade dela...

o area shape é responsável por dar os formatos, ao fazer isso, eu aconselho a você abrir o paint, e veja la embaixo, que quando você passa

o mouse pela imagem, ele lhe da as coordenadas...

rect - retangulo, ele vai lhe fazer um quadrado na imagem, sendo que voce tera que dar 2 coordenadas no coords="x1, y1, x2, y2" o x1 e y1 são um ponto e o x2 e y2 são outro, sendo que eles devem ser inversos, ou seja, quando um esta no topo na esquerda, o outro deve ser de baixo na direita... acho que da pra você ter uma noção...

circle - circulo, ele muda um pouco em relação ao retangulo, você agora tem que por apenas 3 pontos, que será, o ponto central do circulo, e o raio que você quer que o circulo seja... ou seja, x, y, r...

poly - o poligonal é bem diferente dos outros, você fará assim, ele é bem simples de usar, você tem que ter em mente, que ele trabalha com retas, então pra cada ponto que você vai pondo, x, y, ele vai ligando como se fosse aqueles livrinhos de criança... Se você quiser algo bem minucioso, da pra fazer, vai ficar enorme, mas isso não altera em nada, vai ao seu gosto...

Agora vamos para a segunda parte, você quer que o link na imagem redirecione para outra pagina sem levar internamente...

Cara eu montei um body aqui e coloquei esse <a> que voce postou, ele ta normal, ele redireciona normalmente... verifica ae qual navegador q você usa, ou se não é outra parte do código q ta faltano, porque aki funfo certinho... ele redirecionou perfeitamente...

Link to comment
Share on other sites
  • 0
kauecast

kauecast

Posted
  • Author
Posted

Opa valeu pela dica.

Vou mexendo pra aprender a usar. acho que vou usar no rodapé.

obs. O link abre na mesma aba ou abre uma nova aba? No Chrome abre em uma nova aba.

Eu queria que abrisse na mesma aba.

Eu coloquei target="parent", pois com os outros códigos abria na foto. ai o menos pior é deixar em uma nova aba.

Deixar sem o target ou colocando target="_self" ele abre na foto e não na mesma aba (pelo menos, não nela inteira)

Acho que ficou confuso, mas recapitulando:

Com os códigos disponíveis em tutorias, abrem ou em nova aba (atual código) ou na própria foto e eu gostaria que abrisse na mesma aba, simplesmente clica no link e a pagina recarregar (para a nova).

Os códigos que deveriam fazer isso abrem na própria foto.

Link to comment
Share on other sites
  • 0
atkins

atkins

Posted
Posted (edited)

Ata, entendi, vo dar um look aki então...

Cara eu coloquei assim:

<a href="https://sites.google.com/site/golacocomercioferroeaco/forjados-1" target="_self"><img src="https://sites.google.com/site/golacocomercioferroeaco/gate.jpg" alt="Third Image" title="Acesse" border="none" /></a>

Foi normal... Portanto eu concluo que é o método amostral das fotos que ta fazendo isso, não sei se você vai querer postar o código dele, mas não precisa se encucar com esse código porque não é esse o problema...

Qualquer coisa, se você postar, eu dou uma olhada e te ajudo a resolver...

Agora uma coisa que fiquei em dúvida, eu achei algo estranho, porque o nome é forjados-1, você nomeou o arquivo assim mesmo ou é um método diferente?

Edited by atkins
Link to comment
Share on other sites
  • 0
kauecast

kauecast

Posted
  • Author
Posted (edited)

O forjados 1 é a área do site que link direciona, é que quando criei no googlesites coloquei assim, mas depois mudei para serralheria artística.

Eu coloquei o self, olha como ficou. Ainda to testando tudo, vou mudar os textos e as fotos, o link tá na terceira imagem, ele direciona para a própria aba do serralheria artística: https://sites.google.com/site/golacocomercioferroeaco/

Olha como tá recarregando.

olha o código (pra cima disso tem o sycle, e moldura do slide)

<body>

<div id="rotatorgroup">

<div class="rotator">

<div class="item">

<img src="https://sites.google.com/site/golacocomercioferroeaco/golaco.jpg" alt="First Image" />

<div class="info">

<h2>EMPRESA</h2>

<p>Desde 1997 cormercializando tubos, chapas, perfis e muito mais.</p>

</div>

</div>

<div class="item">

<img src="https://sites.google.com/site/golacocomercioferroeaco/loja.jpg" alt="Second Image" />

border="0"></a>

<div class="info">

<h2>CONTATO</h2>

<p>Entre em contato com nossa equipe de vendedores ou venha ate nos.</p>

</div>

</div>

<div class="item">

<a href="https://sites.google.com/site/golacocomercioferroeaco/forjados-1" target="_self"><img src="https://sites.google.com/site/golacocomercioferroeaco/gate.jpg" alt="Third Image" border="none" /></a>

<div class="info">

<h2>FERRO PARA SERRALHERIA ARTISTICA</h2>

<p>Temos uma linha completa de materias para serralheria artistica.</p>

</div>

</div>

</div>

<div id="prev">&laquo;</div>

<div id="next">&raquo;</div>

<div id="nav"></div>

</div>

</body>

Edited by kauecast
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
 Share
Go to question listing


  • Forum Statistics

    • Total Topics
      152.2k
    • Total Posts
      652k
×
×
  • Create New...