Затемнение фона

[ZABor1978]

Добрый день, гуру вёрстки!
 
Нужда  попросила затемнить фон всего сайта при наведении на определённый объект. При этом сам объект должен оставаться при этом на первом плане. В мыслях подумал, что плёвое дело, и родил это:

<style>body { background: #ccc; }.banner { background: #fff; border: 1px solid #000; text-align: center; background: #fff; height: 400px; width: 240px; position: absolute; z-index: 100; }.banner div { display: none; }.banner:hover div { background: #000; display: block; position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 1; }</style><div class="banner">Hover Me<div></div></div>

Естественно, мой «хитроумный план» не сработал. Подскажите дурню решение, пожалуйста!

 

Заранее большое спасибо!

[CroaToa]

http://jsfiddle.net/fnS37/ правда там не затемнение ))

[Z1gnet]

ваш план был близок к успеху. можно попробовать так http://codepen.io/Z1gnet/pen/JklpD/