jQuery show/hide/mouseenter問題

Question

我有四行文字，我想在每行的右側顯示mouseenter上的特定圖像。

我有現在的問題是，所有的四個圖像同時顯示beeing。

我在做什麼錯？

http://jsfiddle.net/m97qebjr/10

的jQuery：

$(".thumb").hide(); 
$(".text").mouseenter(function() { 
$(".thumb").show(); 
}).mouseleave(function() { 
$(".thumb").hide(); 
}); 

Answer 1

你不需要jQuery的根本：http://jsfiddle.net/m97qebjr/16/

.thumb { 
    display:none; /* added line */ 
    float:right; 
    overflow:hidden; 
    width:100px; 
    height:100px; 
} 
.wrap:hover .thumb{ /* added rule */ 
    display:block; 
} 

Answer 2

$(".thumb")匹配所有類拇指元素。試試這個：

$(".thumb").hide(); 
$(".text").mouseenter(function() { 
    $(this).siblings(".thumb").show(); 
}).mouseleave(function() { 
    $(this).siblings(".thumb").hide(); 
}); 

更新小提琴：http://jsfiddle.net/m97qebjr/13/