javascript - Dim rest screen on hover of menu -

following js fiddle in tried create light out effect following website bankalhabib.com, issue on hover on menu rest of screen not getting dim want , instead menu getting dim.

kindly let me know ow can resolve issue can achieve same effect above mentioned site?

thanks,

http://jsfiddle.net/49qvm/9/

<ul>     <li>home</li>     <li>about</li>     <li>contact</li>     <li>num</li> </ul>  $('li').hover(function(){     $(this).addclass('hovered'); },function(){     $(this).removeclass('hovered'); }); 

i think best bet create element darken effect on screen. when hover on ul element toggle visibility of darkening element.

you need sure z-index value ul element higher element provides darkening effect (remember this! when setting z-index on element need sure set it's position css property relative, fixed, or absolute).

here's fiddle: http://jsfiddle.net/49qvm/28/