plein écran de superposition avec css/jquery

je suis en train de faire un "énorme" div qui remplit la fenêtre avec l'opacité de 0,4 ou quoi que ce soit. Le problème est de savoir comment le faire. J'ai essayé de faire un div avec tout mon contenu de la page à l'intérieur et lui donner cet propriétés:

.div{
  width:100%;
  height:100%;
  background:#000;
  opacity:0.5;
}

depuis cela ne fonctionne pas, j'ai essayé d'ajouter un z-index et mettre une grande valeur, mais il ne fonctionne pas non plus.
une idée?
je veux faire quelque chose comme ceci:

plein écran de superposition avec css/jquery

OriginalL'auteur nick | 2014-04-24