jQuery的淡入DIV用於重複類

Question

我試圖做的非常相似，什麼在這個問題解釋的東西 - jQuery hover : fading in a hidden div while fading out the "default" one

我已經是我想用/縮小褪色上重複類的問題，而不是使用單個ID作爲選擇器的這個示例。在將鼠標懸停在圖像上時，使用相同類的頁面上的其他圖像也會消失。下面是我得到了什麼：

HTML

<div class="test"> 
      <div class="img rounded"> 
       <div class="post_image"> <a href="#"><img src="http://graphics8.nytimes.com/images/2009/07/19/arts/Pool4.jpg" border="0"></a> 
       </div> 
      </div> 
      <div class="post_body hide"> 
       <p>This is a dummy text to fadeThis is a dummy text to fadeThis is a dummy text to fadeThis is a dummy text to fadeThis is a dummy text to fade This is a dummy text 
       </p> 
      </div> 
     </div> 


      <div class="test"> 
      <div class="img rounded"> 
       <div class="post_image"> <a href="#"><img src="http://graphics8.nytimes.com/images/2009/07/19/arts/Pool4.jpg" border="0"></a> 
       </div> 
      </div> 
      <div class="post_body hide"> 
       <p>This is a dummy text to fadeThis is a dummy text to fadeThis is a dummy text to fadeThis is a dummy text to fadeThis is a dummy text to fade This is a dummy text 
       </p> 
      </div> 
     </div> 

jQuery的

<script type="text/javascript"> 
$(function(){ 
$('.test').hover(
     function(){ 
      $('.post_image').fadeOut(100, function(){ 
       $('.post_body').fadeIn(100);       
      }); 
     }, 
     function(){ 
      $('.post_body').fadeOut(100, function(){ 
       $('.post_image').fadeIn(100);       
      }); 
     } 
     ); 


}); 
</script> 

我在jQuery的肯定我需要一個$（本），但不能讓它工作。任何幫助非常感謝！

Answer 1

使用$(this)對象和find()功能應該工作更好地爲您：

$(function(){ 
    $('.test').hover(function(){ 
     $(this).find('.post_image').fadeOut(100,function(){ 
      $('.post_body').fadeIn(100); 
     }); 
    },function(){ 
     $(this).find('.post_body').fadeOut(100,function(){ 
      $('.post_image').fadeIn(100); 
     }); 
    }); 
});