title: Delay the close event on beforeClose of jQuery UI Dialog
body: <p>I have the following code with CSS Animations running on the <code>.in</code> and <code>.out</code> classes.
  My problem is that the Dialog is closing instantly and you don't see the close animation happen at all. So I need a delay of ~500ms before closing the dialog;</p>
  
  <pre><code>$.extend( $.ui.dialog.prototype.options, { 
      modal: true, 
      open: function() { 
          $(this).parents('.ui-dialog').removeClass('out').addClass('in'); 
      }
  });
  
  $confirm.dialog({
  
      buttons: {
  
          "ok": {
              text:'Ok',
              click: function() { $(this).dialog('close'); }
          },
  
          "cancel": {
              text:'Cancel',
              click: function() { $(this).dialog('close'); }
          }
      },
  
      beforeClose: function(event, ui) {
  
          $('.ui-dialog').removeClass('in').addClass('out');
  
      }
  
  }).dialog('widget').appendTo('.dialogWrapper');
  </code></pre>
  
  <p>I tried adding <code>return false</code> into the <code>beforeClose</code>, and then manually calling the <code>.dialog('close')</code> function but that just runs an infinite loop, and hiding the dialog manually seems to be wasted code (not to mention the overlay for the dialog would need to be removed, also)</p>
  
  <p>I'd appreciate any help on the matter.</p>
  
  <p>Si.</p>