title: Dont load the page until banner image is loaded
body: <p>I have different images that load into a banner image. I don't want the page to load until the image has loaded.</p>
  
  <pre><code>&lt;div id="banner-image" class="col-md-12"&gt;
  &lt;img class="img-responsive" src="http://i.imgur.com/pAqR6tw.png"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I have looked at several ways of preloading the image with <code>JQuery</code>, which all seem incredibly heavy. I wonder if anyone has any ideas for a more lightweight solution?</p>