title: Overlay modal using jquery hide and show
body: <p>I want to do an overlay for my post content, like a 'full-screen modal dialog'. I've stuck at hiding and showing my content and items. I want when the content is shown, the items will become invisible.</p>
  
  <p><a href="http://jsfiddle.net/vjdwLzx8/" rel="nofollow">http://jsfiddle.net/vjdwLzx8/</a></p>
  
  <pre><code>$(function(){
      $('.item').on('click',function(){
          $(this).next('.content').css('display','block');
      });
  
  
  });
  </code></pre>
  
  <p>I also tried </p>
  
  <pre><code> var item= $(this).next('.content').detach();
  $('body').html('').append(item.css('display','block'); 
  </code></pre>
  
  <p>but I have to reload the page to get back to the item page which is something bad.</p>