title: loading large images page load time
body: <p>I've tried a couple of ways to do this and have found issues with both.</p>
  
  <ol>
  <li>Loading the image from a ajax post, and updating an img id source to it.</li>
  <li>PHP function that loads all images in a "li" list with a class set to display:none and with jquery hide/show the image.</li>
  </ol>
  
  <p>My problem is that these images are 1440px x 960px minimum.  So if I load with ajax post it takes a while to show the full image, and if I load with php loop it takes a veryyyy long time for the page to load.</p>
  
  <p>Here is my example of my php loop function:</p>
  
  <pre><code>public function LoadStreamImages()
  {
      $imgs = '&lt;li id="0"&gt;&lt;img src="img/OM.jpg" class="bgimg" /&gt;&lt;/li&gt;';
      if($db-&gt;num_rows($consulta)&gt;0)
      {
          while($row = $db-&gt;fetch_array($consulta)) { 
              $imgs .= '&lt;li id="' . $row['id'] . '" class="hidden"&gt;&lt;img src="img/' . $row['imagefile'] . '" class="bgimg" /&gt;&lt;/li&gt;';
          }
      }   
  
      echo $imgs;
  }
  </code></pre>
  
  <p>anything I can do to spead this up?</p>