Ir para conteúdo

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Pablo Gates

Problemas com mouseenter() e mouseleave()

Recommended Posts

Preciso de ajuda com esse código, quando passo o mouse no link com classe .show_post no primeiro link ele abre a div com classe .post-prev, mas quando passo mouse no segundo link ele abre as duas classes .post-prev e .post-next, mas o correto seria cada link exibir sua respective div.

 

Para ser mais direto segue o jsfiddle: http://jsfiddle.net/pabloworks/m4q6B/

 

HTML

 

 

<a href="#" class="btn-abs prev-new hide show_post" data-id="1">◄</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>►</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');
    });
});

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.