title: fade in div following showDiv() setTimeout
body: <p>Really quick question - (I hope!)</p>
  
  <p>I have a div that doesnt display until the rest of the page has loaded using:</p>
  
  <pre><code>&lt;script&gt;
      function showDiv(){
          var obj = document.getElementById('test');
          obj.style.display = 'block';
      }
  &lt;/script&gt;
  </code></pre>
  
  <p>in the head of my html, and the following code in the body:</p>
  
  <pre><code>&lt;body onLoad="setTimeout('setTimeout(showDiv()', 1000);"&gt;
  &lt;div id="test" style="display:none;"&gt;
  </code></pre>
  
  <p>While the div loads after a set time correctly, I was wondering if there was a way to fade this div in after the given "Timeout", using something like:</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(function(){  // $(document).ready shorthand
  $('#test').hide().fadeIn(1500);
  });
  &lt;/script&gt;
  </code></pre>
  
  <p>for example? At the moment, the div suddenly appears, although I am hoping to get it to fade in somehow. I have tried to merge these two js functions, but to this end unsuccessfully. Any help or advice much appreciated!</p>