5

Quando passo o mouse no primeiro link com a class show_post ele exibe a div correta que tem de exibir, mas quando passo o mouse no segundo link o script abre as 2 divs e não somente a solicitada.

Segue o fiddle: http://jsfiddle.net/pabloworks/m4q6B/

HTML

<a href="#" class="btn-abs prev-new hide show_post" data-id="1">&#9668;</a>

        <div class="post-prev content-show" id="1">
            <a href="#">
             <span>titulo 01</span>
            </a>
        </div>


<a href="#" class="btn-abs next-new hide show_post" data-id="2"><span>&#9658;</span></a>

        <div class="post-next content-show" id="2"> 
            <a href="#">
             <span>titulo 02</span>
            </a>
        </div>

JS

$(function(){
$(".post-prev, .post-next").hide();
    var id;

    $('.show_post').mouseenter(function(){
   id = '.post-prev, .post-next #'+$(this).data("id");

   console.log(id); //verificando o id de quem disparou o evento

   $(id).stop().fadeIn('fast');
    })

    .mouseleave(function(){
   $(id).fadeOut('fast');
    });
});
2
  • O código no jsfiddle está diferente do código colocado aqui
    – Paulo
    16/04/2014 às 19:02
  • 1
    faltou uma class, eu já alterei lá ... 16/04/2014 às 19:03

1 Resposta 1

5

Hum... Se a divque deve aparecer / desaparecer é sempre o próximo elemento após o link, utilize a função .next():

$('.show_post').mouseenter(function(){
   $(this).next().stop().fadeIn('fast');
})

$('.show_post').mouseleave(function(){
     $(this).next().stop().fadeOut('fast');
});

Com isso você não vai mais precisar dos ids, data-id, etc.

3
  • 1
    Que trapalhada que eu fiz! Primeiro uma resposta errada, depois outra duplicada... Chega, +1 pra você.
    – bfavaretto
    16/04/2014 às 19:12
  • Eu ia postar, vi sua resposta, cancelei a minha e votei a sua. Vi que você deletou, digitei a resposta pela segunda vez e postei. Estamos sofrendo de Livelock :). 16/04/2014 às 19:16
  • Muito Obrigado, funcionou jsfiddle.net/pabloworks/m4q6B agora vou resolver um probleminha de css que não me permite clicar no conteúdo exibido =D 16/04/2014 às 19:17

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .