title: Adding loading image while PHP script runs
body: <p>I have a PHP script (pasted below) which pulls in meta data from a list of URL's, the problem is it can take a while to load and the user never knows when it's completely finished (unless they keep an eye on the loading icon in their broswer tab)</p>
  
  <p>I've been looking around online for a long time but cannot find a solution to this, I've read I can use Ajax but how exactly could I use it on this script?</p>
  
  <p>Thanks for the help!</p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  function showContent(vThis)
  {
      // http://www.javascriptjunkie.com
      // alert(vSibling.className + " " + vDef_Key);
      vParent = vThis.parentNode;
      vSibling = vParent.nextSibling;
      while (vSibling.nodeType==3) { // Fix for Mozilla/FireFox Empty Space becomes a TextNode or         Something
          vSibling = vSibling.nextSibling;
      };
      if(vSibling.style.display == "none")
      {
          vThis.src="collapse.gif";
          vThis.alt = "Hide Div";
          vSibling.style.display = "block";
      } else {
          vSibling.style.display = "none";
          vThis.src="expand.gif";
          vThis.alt = "Show Div";
      }
      return;
  }
  
  &lt;/script&gt;
  
  
  
  &lt;form method="POST" action=&lt;?php echo "'".$_SERVER['PHP_SELF']."'";?&gt; &gt;
  &lt;textarea name="siteurl" rows="10" cols="50"&gt;
  &lt;?php //Check if the form has already been submitted and if this is the case, display the   submitted content. If not, display 'http://'.
  echo (isset($_POST['siteurl']))?htmlspecialchars($_POST['siteurl']):"http://";?&gt;
  &lt;/textarea&gt;&lt;br&gt;
  &lt;input type="submit" value="Submit"&gt;
  &lt;/form&gt;
  &lt;/div&gt;
  
  &lt;div id="nofloat"&gt;&lt;/div&gt;
  &lt;div style="margin-top:5px;"&gt;
  &lt;h4&gt;&lt;img src="expand.gif" alt="Show Div" border="0" style="margin-right:6px; margin-  top:3px; margin-bottom:-3px; cursor:pointer;" onclick="showContent(this);" /&gt;Show me the    script working!&lt;/h4&gt;
  &lt;div style="margin-top:5px; display:none;"&gt;
  &lt;table class="metadata" id="metatable_1"&gt;
  &lt;?php
  ini_set('display_errors', 0);
  ini_set( 'default_charset', 'UTF-8' );
  error_reporting(E_ALL);
  //ini_set( "display_errors", 0);
  function parseUrl($url){
      //Trim whitespace of the url to ensure proper checking.
      $url = trim($url);
      //Check if a protocol is specified at the beginning of the url. If it's not,     prepend 'http://'.
      if (!preg_match("~^(?:f|ht)tps?://~i", $url)) {
              $url = "http://" . $url;
      }
      //Check if '/' is present at the end of the url. If not, append '/'.
      if (substr($url, -1)!=="/"){
              $url .= "/";
      }
      //Return the processed url.
      return $url;
  }
  //If the form was submitted
  if(isset($_POST['siteurl'])){
      //Put every new line as a new entry in the array
      $urls = explode("\n",trim($_POST["siteurl"]));
      //Iterate through urls
      foreach ($urls as $url) {
              //Parse the url to add 'http://' at the beginning or '/' at the end if not   already there, to avoid errors with the get_meta_tags function
              $url = parseUrl($url);
              //Get the meta data for each url
              $tags = get_meta_tags($url);
              //Check to see if the description tag was present and adjust output    accordingly
              $tags = NULL;
  $tags = get_meta_tags($url);
  if($tags)
  echo "&lt;tr&gt;&lt;td&gt;$url&lt;/td&gt;&lt;td&gt;" .$tags['description']. "&lt;/td&gt;&lt;/tr&gt;";
  else 
  echo "&lt;tr&gt;&lt;td&gt;$url&lt;/td&gt;&lt;td&gt;No Meta Description&lt;/td&gt;&lt;/tr&gt;";
      }
  }
  ?&gt;
  &lt;/table&gt;
  &lt;/div&gt;
  &lt;script type="text/javascript"&gt;
          var exportTable1=new ExportHTMLTable('metatable_1');
      &lt;/script&gt;
  &lt;div&gt;
          &lt;input type="button" onclick="exportTable1.exportToCSV()"   value="Export to CSV"/&gt;
          &lt;input type="button" onclick="exportTable1.exportToXML()"   value="Export to XML"/&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>