title: How to preload images using CSS?
body: <p>I'm trying to implement this code to preload images, but it isn't working. </p>
  
  <p>Add CSS:</p>
  
  <pre class="lang-css prettyprint-override"><code>div#preload { display: none; }
  </code></pre>
  
  <p>In the footer within the <code>&lt;/body&gt;</code> tag:</p>
  
  <pre><code>&lt;div id="preload"&gt;
      &lt;img src="http://gearenergy.com/wp-content/uploads/2018/04/Home-Banner-final.jpg" width="1140px" height="500px" alt="Home-Banner_01" /&gt;
      &lt;img src="http://gearenergy.com/wp-content/uploads/2018/04/front-page-background.jpg" width="550px" height="400px" alt="PresentationBG_02" /&gt;
      &lt;img src="http://gearenergy.com/wp-content/uploads/2018/07/orange-color-overlay.png" width="600px" height="600px" alt="FinanceReportBG_03" /&gt;
      &lt;img src="http://gearenergy.com/wp-content/uploads/2018/04/front-page-background-blue.jpg" width="550" height="400" alt="LatestNewsBG_04" /&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>Obviously I've replaced the HTML and repointed to the images, but it's still not working.</p>