title: JQuery right click contextmenu
body: <p>Hi I'm new to JQuery and I just want to have a rightclick contextmenu. I googled it and found sample code</p>
  
  <p>This is the code I'm using.</p>
  
  <pre><code>  $(document).ready(function(){
      $('#rightclickarea').bind('contextmenu',function(e){
      var $cmenu = $(this).next();
  
      $('&lt;div class="overlay"&gt;&lt;/div&gt;').css({left : '0px', top : '0px',position: 'absolute', width: '100%', height: '100%', zIndex: '100' }).click(function() {
          $(this).remove();
          $cmenu.hide();
      }).bind('contextmenu' , function(){
          return false;}).appendTo(document.body);
      $(this).next().css({ left: getLeftPosition(e), top: getTopPosition(e), zIndex: '101' }).show();
  
      return false;
  
       });
  
       $('.vmenu .first_li').live('click',function() {
          if( $(this).children().size() == 1 ) {
              //alert($(this).children().text());
              $('.vmenu').hide();
              $('.overlay').hide();
          }
       });
  
       $('.vmenu .inner_li span').live('click',function() {
              //alert($(this).text());
              $('.vmenu').hide();
              $('.overlay').hide();
       });
  
  
      $(".first_li , .sec_li, .inner_li span").hover(function () {
          $(this).css({backgroundColor : '#E0EDFE' , cursor : 'pointer'});
      if ( $(this).children().size() &gt;0 )
              $(this).find('.inner_li').hide();   
              $(this).css({cursor : 'default'});
      }, 
      function () {
          $(this).css('background-color' , '#fff' );
          $(this).find('.inner_li').hide();
      });        
  
  });
  </code></pre>
  
  <p>My problem is when i rightclick everything works fine. But when i rightclick again nothing appears. I should do a middle leftclick and rightclick again if want the menu to appear again.
  can anyone help to solve this issue</p>
  
  <p>Thanks in advance</p>