FadeIn 1元素

Question

我正在製作一個包含3個項目組合的主頁，當我將其中一個項目懸停在其中時，必須在此元素上淡出div。但是，當我懸停1時，我的代碼在所有div中都淡入淡出。所以我使用.closest（）嘗試了它，但現在沒有任何事情發生。有人可以幫我弄這個嗎？

我的HTML：

<div class="hpi"> 

    <div class="hpi_wrap"> 
     <h2>Title of this item</h2> 
     <p>Blablablab</p> 
    </div> 

    <img src="//"> 

<div><!--End hpi1--> 

<div class="hpi1"> 

    <div class="hpi_wrap"> 
     <h2>Title of this item</h2> 
     <p>Blablablab</p> 
    </div> 

    <img src="//"> 

<div><!--End hpi2--> 

<div class="hpi"> 

    <div class="hpi_wrap"> 
     <h2>Title of this item</h2> 
     <p>Blablablab</p> 
    </div> 

    <img src="//"> 

<div><!--End hpi3--> 

我.hp1_wrap樣式爲顯示：無;

我的jQuery：

$(document).ready(function(e) { 


    $(".hpi").hover(function(){ 
     $(this).closest('.hpi_wrap').fadeToggle(300); 
    }); 

}); 

Answer 1

使用find()而不是closest()

$(document).ready(function(e) { 
    $(".hpi").hover(function(){ 
     $(this).find('.hpi_wrap').fadeToggle(300); 
    }); 

});