title: Loading Image in GWT
body: <p>I have been working on a project in GWT for which i need to show a loading image as like "Please Wait...".</p>
  
  <p>I was able to fix this till page loads. But during history token changes, i cant show the same. I created a division as shown below,</p>
  
  <pre><code>&lt;div id="loader"&gt;
              &lt;div id="loaderPanel"&gt;
              &lt;/div&gt;
              &lt;div id="loaderImage"&gt;
                  &lt;div id="loaderText"&gt;
                      &lt;b&gt;Please Wait...&lt;/b&gt;
                  &lt;/div&gt;
                  &lt;img src="images/loader.gif"/&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>Also, here is my CSS</p>
  
  <pre><code>#loaderPanel {
      background-color: white;
      display: block;
      height: 100%;
      left: 0;
      opacity: 0.8;
      position: fixed;
      top: 0;
      width: 100%;
      z-index: 1001;
  }
  
  
  #loaderImage {
      background-color: transparent;
      left: 48%;
      position: fixed;
      top: 48%;
      z-index: 1002;
  }
  
  #loaderImage img{
      height:22px;
      margin-left:4px;
      margin-top:0px;
      width:119px;
  }   
  
  #loaderText{
      font-family:'Verdana';
      font-weight:bold;
      font-size:0.9em;
      float:left;
  }
  </code></pre>
  
  <p>This is the piece of code i used to make the DIV visible &amp; invisible.</p>
  
  <pre><code>DOM.getElementById("loader").getStyle().setDisplay(Display.NONE);
  DOM.getElementById("loader").getStyle().setDisplay(Display.BLOCK);
  </code></pre>
  
  <p>Can anyone please suggest me a better way to show a loading GIF image for History Changes?</p>