title: Loading image with multi page
body: <p>I'm developing a new app with Phonegap and jQuery Mobile.
  I'd like that when content are still in "loading status" (and the page isn't completly showed), appears an loading image (default gif animate of jqm).</p>
  
  <p>My app is a multi-page application like this:  </p>
  
  <pre><code>&lt;div data-role="page" id="page1"&gt;
  &lt;p&gt;Some stuff for page 1 here&lt;/p&gt;
  &lt;/div&gt;
  
  &lt;div data-role="page" id="page2"&gt;
  &lt;p&gt;Some stuff for page 2 here&lt;/p&gt;
  &lt;/div&gt;
  
  &lt;div data-role="page" id="page3"&gt;
  &lt;p&gt;Some stuff for page 3 here&lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I try with:</p>
  
  <pre><code>$(document).on('pageshow','#page3', function(){
  $.mobile.showPageLoadingMsg();
  
  // my code
  
  $.mobile.hidePageLoadingMsg();
  
  });
  </code></pre>
  
  <p>But the loading image don't appears</p>
  
  <p>I try with:</p>
  
  <pre><code>$(document).on('pagebeforeshow','#page2', function(){
  $.mobile.showPageLoadingMsg();                         
  });
  </code></pre>
  
  <p>and</p>
  
  <pre><code>$(document).on('pageshow','#page2', function(){
  
  //all code
  
  $.mobile.hidePageLoadingMsg();
  
  });
  </code></pre>
  
  <p>But the loading don't work. </p>
  
  <p>What is the correct way for using the loading image with jQuery Mobile?</p>