title: Showing image processing for 10 sec
body: <p>How can I show an loading or progress bar on screen for 10 seconds?</p>
  
  <p>Here's my code:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"&gt;
  
  &lt;/script&gt;
  &lt;script&gt;
  $(function(){
  
      $('#loadaing').hide();
  
      setTimeout(function(){
          $('#loading').fadeIn('slow');
      },1000);
  
  });
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;form  action="" &gt;
  &lt;br /&gt;
  &lt;input type="submit"  value="Click!" style="width:100px;" onclick="$('#loading').show();"/&gt;
  &lt;/form&gt;
  &lt;div id="loading" style="display:none;"&gt;&lt;img src="loading_orange.gif" alt="" /&gt;Loading!&lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I want to achieve the given loading image, showing it for at least 10 sec when I click on the submit button.</p>