title: Javascript : Ajax and Show/Hide Div
body: <p>I use Ajax to request some information for my web page, and pops up a "Please Wait" window while the Ajax is running. </p>
  
  <p>This is working fine in Mozilla and Chrome, but the "Please Wait" window does not show up in IE. </p>
  
  <p>Here is my code :</p>
  
  <pre><code>function openWaitMessage()
  {
     var wid = 300;
     var hgt = 200;
     var left = 0;
     var top = 0;
  
  var myWidth = 0, myHeight = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
      //Non-IE
      myWidth = window.innerWidth;
      myHeight = window.innerHeight;
  } else if( document.documentElement &amp;&amp; ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
      //IE 6+ in 'standards compliant mode'
      myWidth = document.documentElement.clientWidth;
      myHeight = document.documentElement.clientHeight;
  } else if( document.body &amp;&amp; ( document.body.clientWidth || document.body.clientHeight ) ) {
      //IE 4 compatible
      myWidth = document.body.clientWidth;
      myHeight = document.body.clientHeight;
  }
  
  var scrOfX = 0, scrOfY = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
      //Netscape compliant
      scrOfY = window.pageYOffset;
      scrOfX = window.pageXOffset;
  } else if( document.body &amp;&amp; ( document.body.scrollLeft || document.body.scrollTop ) ) {
      //DOM compliant
      scrOfY = document.body.scrollTop;
      scrOfX = document.body.scrollLeft;
  } else if( document.documentElement &amp;&amp; ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
      //IE6 standards compliant mode
      scrOfY = document.documentElement.scrollTop;
      scrOfX = document.documentElement.scrollLeft;
  }
  
  left = scrOfX + (myWidth - wid)/2;
  top =  scrOfY + (myHeight - hgt)/2;
  
  
  var div = document.getElementById("pleaseWait");
  div.style.display = '';
  div.style.visibility = 'visible';
  div.style.left = left;
  div.style.top = top;
  
   } // openWaitMessage()
  
     function getInformation { 
         openWaitMessage();
  
      //////////////////////////////////////////////////////////////////////
      // create a new ListRequest object and add the 'category' parameter //
      //////////////////////////////////////////////////////////////////////
      var listRequest = new ListRequest("lotatt-request");
  
      /////////////////////////////////////
      // create a new AjaxRequest object //
      /////////////////////////////////////
      var ajaxRequest = new AjaxRequest("/MyProject/services");
  
      /////////////////////////////////////////
      // send the list request to the server //
      /////////////////////////////////////////
      sendListRequest(ajaxRequest,listRequest,fillLotAtt,ajaxError); 
     }
  </code></pre>
  
  <p>HTML :</p>
  
  <pre><code>   &lt;div id="pleaseWait" style=" display: none; visibility: hidden;  position:absolute; left:0px; top:0px; width:300px; height:200px; z-Index:999;"&gt;
      &lt;table border="1" cellspacing="0" cellpadding="0" width="100%"&gt;
          &lt;tr class="dialogHeaderCell" &gt;
              &lt;td&gt;
                  Please Wait...
              &lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td align="center"&gt;
                  &lt;img src="please_wait.gif" alt="Loading...Please wait."&gt;
              &lt;/td&gt;
          &lt;/tr&gt;
      &lt;/table&gt;
  &lt;/div&gt;
  
    &lt;input type="button" name="DisplayInfo" class="secondary_button" value="Display Information " onClick="getInformation ()"/&gt;
  </code></pre>
  
  <p>Please help, Thanks ahead</p>