title: How to remove page background for Jquery Mobile Dialog?
body: <p>The dialog itself only occupies about 10% of the page and I wanted to remove or turn the dialog's page background into transparent so that the previous page will still be visible.</p>
  
  <p>This is the js that calls the dialog:</p>
  
  <pre><code>$.mobile.changePage('#popdiv',{transition:'slide', role:'dialog'});
  </code></pre>
  
  <p>and this is the div</p>
  
  <pre><code>&lt;div data-role="page" id="popdiv" data-role="page"  data-theme="e"&gt;        
    &lt;div data-role="content"&gt;
    &lt;h1&gt;Congrats!&lt;/h1&gt;
    &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I tried using custom css but it doesn't seem to change anything</p>
  
  <pre><code>div#popdiv {
     background: none; // i also used background-image and color and set it to none
  }
  </code></pre>
  
  <p>and this is how i declared the css and js</p>
  
  <pre><code>&lt;custom css&gt;
  &lt;jquery mobile css&gt;
  &lt;jquery min.js&gt;
  &lt;phonegap.js&gt;
  &lt;custom.js&gt;
  &lt;jquerymobile.js&gt;
  </code></pre>
  
  <p>Please help. many thanks.</p>