多個相似的元素，一次對單個元素應用效果

Question

請檢查以下代碼。它是一個自動生成的代碼。我希望僅將fadeIn（）效果應用於「thumb-info」類。

<div class="work-thumbs"> 
<article> 
<div class="thumb"><img src="1.jpg" /></div> 
<div class="thumb-info">Link #1 - Heading #1</div> 
</article> 

<article> 
<div class="thumb"><img src="2.jpg" /></div> 
<div class="thumb-info">Link #2 - Heading #2</div> 
</article> 
</div><!--/.work-thumbs--> 

我寫了如下的jQuery代碼，但它適用於列表中的所有元素。

$('.thumb').mouseenter(function(){ 
$('thumb-class').fadeIn('slow'); 
}); 

我希望它僅適用於在光標懸停在目前的元素。

謝謝你的時間。

編輯：謝謝您的回答，但「拇指信息」是一個隱藏的元素和「.thumb」懸停只有它會出現，所以我不能使用拇指信息類「這」功能。如果這就是你的建議。

Answer 1

因爲你是選擇所有帶班的thumb-info的元素，你可以使用next()或siblings()方法，試試這個：

$('.thumb').hover(function(){ 
    $(this).next().fadeIn('slow'); 
    // or $(this).siblings('.thumb-info').fadeIn('slow'); 
},function(){ 
    $(this).next().fadeOut('slow'); 
    // or $(this).siblings('.thumb-info').fadeOut('slow'); 
}); 

Fiddle

1. next()
2. hover()
3. siblings()

Answer 2

使用jQuery .hover（）並傳入$ this。

$('.thumb-info').hover(function() { 
    $(this).dosomething // 
}); 

通過在你的函數處理程序使用this，你只是被影響徘徊的元素。

Answer 3

使用$(this)，以便它不適用於具有該類的所有元素。

$(".thumb").hover(function(){ 
    $(this).next().fadeIn(); 
},function(){ 
    $(this).next().fadeOut(); 
});