jQuery « gris » en reste de la page en dehors de l'utilisateur div est en vol stationnaire sur

Question

Je travaille sur un projet de tableau de bord où le directeur artistique souhaite avoir un effet semblable à celui qu'on voit ici:

http://www.asos.com/

Sauf lorsque l'utilisateur survole un widget de tableau de bord, il y a une superposition sur tous les autres éléments de la page, y compris le corps, de la même manière que Colorbox et tout.

Je pensais à la création d'un nouveau div qui couvre toute la largeur de la fenêtre avec z-index 2, tous les widgets non actifs ont z-index 3 et le widget plané actif a z-index 1.

Est-ce que quelqu'un a vu ou essayé ceci pour faire grand effet?

Merci.

Answer 1

siblings

<ul class="listOfImages"> 
    <li><img ... /></li> 
    <li><img ... /></li> 
    <li><img ... /></li> 
</ul> 
<script> 
$('.listOfImages li').hover(function(){ 
    $(this).siblings().fadeOut(); 
}, function(){ 
    $(this).siblings().fadeIn(); 
} 
); 
</script>