title: Dim rest screen on hover of menu
body: <p>Following is my js fiddle in which i tried to create a light out effect like the following website bankalhabib.com, The issue is that on hover on menu my rest of screen is not getting dim which i actually want and instead only my menu is getting dim.</p>
  
  <p>Kindly let me know ow can i resolve this issue so i can achieve the same effect as above mentioned site?</p>
  
  <p>Thanks,</p>
  
  <p><a href="http://jsfiddle.net/49Qvm/9/">http://jsfiddle.net/49Qvm/9/</a></p>
  
  <pre><code>&lt;ul&gt;
      &lt;li&gt;Home&lt;/li&gt;
      &lt;li&gt;About&lt;/li&gt;
      &lt;li&gt;Contact&lt;/li&gt;
      &lt;li&gt;Num&lt;/li&gt;
  &lt;/ul&gt;
  
  $('li').hover(function(){
      $(this).addClass('hovered');
  },function(){
      $(this).removeClass('hovered');
  });
  </code></pre>