title: Fow of loading webpage background image
body: <p>I have webpage i am using very large size background image for that, the issue is when normally we visit the page it will display website contents and then load the background image.</p>
  
  <p>in my case the situation is different my webpage is waiting untill the background image is loaded and then start displaying the page contents.</p>
  
  <p>I use very simple CSS</p>
  
  <pre><code>body{background-image:url('http://www.example.com/myimage.jpg')}
  other css goes here....
  </code></pre>
  
  <p>and webpage load flow is</p>
  
  <pre><code>Background image load first (webpage display no contents it just load the image)  
       |
  then load the contents.
  </code></pre>
  
  <p>I want to <strong>load the contents first and then background image</strong> anybody have idea how to do that. (using simple method) or <strong>asynchronous loading of background-image and contents</strong>. </p>