title: hide jquery facebox modal manually
body: <p>I used my custom close button on my facebox modal to close it... It works fine (ie) it closes but it appends to the bottom of the page after i click the close button...</p>
  
  <pre><code>&lt;a onclick="$.facebox.close();" href="javascript:void(0);" class="close"&gt; 
    &lt;img alt="Close the popup" src="images/close.png" title="close" 
       class="close_image" /&gt; 
  &lt;/a&gt;
  </code></pre>
  
  <p>Here is what i get,</p>
  
  <p><a href="https://i.stack.imgur.com/U6yFU.jpg" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/U6yFU.jpg" alt="alt text"></a>
  </p>
  
  <p>Here is what i am trying to do,</p>
  
  <pre><code>$(document).bind('close.facebox', function() {
          $(document).unbind('keydown.facebox')
          $('#aspnetForm').append($('#facebox .content').html());
          /// extra line to make sure there's no flashing effect as the facebox closes: the content is still in there too!
          $('#facebox .content').children().css({ 'display': 'block' });
          $('#facebox').fadeOut(function() {
              $('#facebox .content').removeClass().addClass('content')
              hideOverlay()
              $('#facebox .loading').remove()
          })
  
      })
  </code></pre>
  
  <p>My page has this,</p>
  
  <pre><code>   $(document).ready(function($) {
          $.facebox.settings.opacity = 0.2;
          $('a[rel*=facebox]').facebox();
       });
  
    &lt;div id="forgetPassword" style="display:none"&gt; 
      //content
     &lt;/div&gt;
  </code></pre>