使用jQuery突出一个div，而变灰他人(Using jQuery to highlight a

我半路上有这个问题，但都被卡住。我相信，类似的问题在过去，但没有完全是我正在寻找被提出。

我目前有一些的jsfiddle演示代码，可以在这里查看： http://jsfiddle.net/WolfHook/jb36D/

HTML

<div id="thumbsContainer">
<div class="imageHolder">
    Image in Here...
</div>
<div class="imageHolder">
    Image in Here...
</div>
<div class="imageHolder">
    Image in Here...
</div>

CSS

#thumbsContainer {
background:#000;
padding:20px;
overflow:auto;}

.imageHolder {
background:#eee;
float:left;
margin:5px;
width:50px;
height:50px;
padding:5px;
border:1px solid #666;}

jQuery的

$('#thumbsContainer').children('.imageHolder').hover(function() { $(this).siblings().stop().animate({'opacity':'0.5'}); }, 
function() { $(this).siblings().stop().animate({'opacity':'1'}); });

所需的效果是让所有的div显示按照正常的话，一旦你将鼠标悬停在一个div，其他周围的人变灰或有某种覆盖的添加到他们。其目的是给你的印象有你的鼠标指针上突出了股利。

你可以看到我对的jsfiddle代码实现了这一点，但每个div的，而不是某类覆盖的适用的不透明度和它的这个，这是造成我的问题，我的当前项目的div坐在上面的背景图像，而不是全黑背景所以透明度不上班，只是使整个事情看起来很奇怪。

理想我想申请在未加亮的div一个div覆盖，这我可以使用CSS给一个灰色的效果风格。在这个阶段，我就如何达到预期的效果建议完全开放。

任何人都热情地向凑钱，并提供我一些指点？

非常感激。

取而代之的将不透明度到imageHolder的股利，或引入新的覆盖件，为什么不采用不透明的div的内容（如缩略图）？所述imageHolder的原因的背景色将显示通过，提供的“变灰”的效果的灰度。

新：

$('#thumbsContainer').children('.imageHolder').hover(function() { 
    $(this).siblings().children('img').stop().animate({'opacity':'0.5'}); }, 
    function() { $(this).siblings().children('img').stop().animate({'opacity':'1'});
});

样品更新你与imageHolders而这一切背后的背景图像的缩略图里面： http://jsfiddle.net/jb36D/11/