• 0
Sign in to follow this  
Henderson

Pegar href dentro de div

Question

Ae galera, beleza?

seguinte..

to listando dados do banco de dados.. são arquivos pra download

os dados são o seguinte

titulo, foto e descrição

então tenho 3 divs.. uma pra cada item

quero que o usuário ao passar o mouse por algum arquivo, todos os dados dele (foto, descrição e titulo) fiquem com um fundo cinza

ok, até aí tudo bem, então fiz a seguinte estrutura html

<div class="listPai">
<div class="listTitulo"><a href="linkDinamico">Título</a></div>
<div class="listFoto"></div>
<div class="listDesc"></div>
</div>
e aí fiz esse js
$(document).ready(function() {
    $("#listaArquivos > div").hover(function() {
    $(this).addClass("listHover");
    }, function() {
    $(this).removeClass("listHover");
    });
});

mas, eu quero também, qe além disso, quando o usuário clicar, ele vá pro link certo daqele determinado arquivo.. quero que tudo seja um link e não somente o titulo

antes eu tava fazendo isso tudo com table.. aí eu colocava o onclick na table, e mandava pro link, mas pra isso usava js obstrusivo

alguém tem alguma idéia de como eu possa fazer isso?!

de uma forma certa e organizada?

Edited by Henderson

Share this post


Link to post
Share on other sites

4 answers to this question

Recommended Posts

  • 0

Existem outras formas de se fazer isso !

Mas como seu código já está assim...

Seria mais simples fazer algo como isto:

<div class="listPai">
<div class="listTitulo"><a href="linkDinamico" onclick="document.location='pagina2.htm'">Título</a></div>
<div class="listFoto"></div>
<div class="listDesc"></div>
</div>

É só colocar o "onclick" dentro do próprio link, ao invés de colocar na tabela...

Qualquer dúvida posta aí !

Share this post


Link to post
Share on other sites
  • 0

de qlqr forma, fazendo assim, o efeito vai ser somente no link

eu quero qe seja na div com classe listPai inteira..

qual outra forma de fazer isso?

to quase colocando um onclick na div mais externa, com a classe listPai.. qe é o qe eu quero..

mas queria fazer com jquery pra usar javascript não obstrusivo já qe meu site inteiro tá assim

mas tá me dando um trabalho descobrir um jeito de fazer esse aí

qe oiutro jeito de fazer você diz?

diga, dependendo do qe for, eu adapto meu código

Share this post


Link to post
Share on other sites
  • 0

Quando vou fazer esse tipo de efeito ou utilizo CSS ou então o próprio JavaScript !

Não utilizo muito jQuery...

Geralmente o código fica assim:

<div class="listPai" id="listPai1">
<div class="listTitulo"><a href="pagina.htm" onmouseover="MouseCima('listPai1')" onmouseout="MouseFora()">Título</a></div>
<div class="listFoto"></div>
<div class="listDesc"></div>
</div>
<div class="listPai" id="listPai2">
<div class="listTitulo"><a href="pagina.htm" onmouseover="MouseCima('listPai2')" onmouseout="MouseFora()">Título</a></div>
<div class="listFoto"></div>
<div class="listDesc"></div>
</div>
E o JavaScript fica assim:
<script type="text/javascript">
function MouseCima(id) {
document.getElementById(id).style.background = "red"
}
function MouseFora() {
i = 1
x = document.getElementById("listPai" + i)
while (x!=null) {
x.style.background = "black"
i++
x = document.getElementById("listPai" + i)
}
}
</script>

Qualquer coisa posta aí !

Share this post


Link to post
Share on other sites
  • 0

sei, sei como é cara

eu também faço assim

mas to tentando seguir o padrão do site

e aí procurando a solução que vai me fazer seguir esse padrão

não ficar colocando javascript no meio do código html

e aí, usar a jQuery porque me facilita usar esse tal de javascript não obstrusivo, qe tá na moda e que os clientes que alguma coisa entendem fazem questão de pedir

eu sei as soluções padrões, tanto que tinha essa página pronta e funcionando exatamente como eu quero

mas, cliente pede, empregado faz, ou tenta..

e cá to eu, tentando aprender o jeito mais difícil, huaeihaei

Share this post


Link to post
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.

Sign in to follow this