title: load jquery modal dialog after a delay
body: <p>I would like to load jquery dialog after a delay of few seconds after page load. Here is my code so far.</p>
  
  <pre><code>&lt;div id="dialog" title="My Dialog Title" style="display:none"&gt;
  &lt;p&gt;This is My Dialog box Description/Content&lt;/p&gt;   
  </code></pre>
  
  <p></p>
  
  <pre><code>    &lt;script type="text/javascript"&gt;
  
      $(document).ready(function() {    
      setTimeout(function(){
        $(function () {
          $("#dialog").dialog({
              show: {
              effect: 'drop',
              direction : 'up',
              distance: 1000,
              duration: 2000,
              },
          });
        });
      }, 2000)
  });
  
  
  &lt;/script&gt;
  
      &lt;style&gt;
  .ui-dialog-titlebar {display:none;}
  #other_content {width:200px; height:200px;background-color:grey;}
  #dialog_content{display:none;}
  &lt;/style&gt;
  </code></pre>
  
  <p>The problem is now that the popup animation of sliding from top is good for Chrome but in firefox it does not come to the center of the screen and for IE there is no popup at all.</p>
  
  <p><a href="http://jsfiddle.net/fakhruddin/x39Rr/9/" rel="nofollow">http://jsfiddle.net/fakhruddin/x39Rr/9/</a></p>
  
  <p>Please guide.</p>