title: Jquery preload image dynamically
body: <p>Wondering why this is not working...</p>
  
  <p>Function:</p>
  
  <pre><code>$.fn.preload = function() {
          this.each(function(){
              $('&lt;img/&gt;')[0].src = this;
          });
      }
  </code></pre>
  
  <p>Code:</p>
  
  <pre><code>&lt;?php $preimages = glob('images/backgrounds/*{.jpg, .png, .gif, jpeg}', GLOB_BRACE); ?&gt;
  
          $([
              &lt;?php 
                  $imgcount = sizeof($preimages);
                  for($i = 0; $i &lt; $imgcount; $i++) {
                      if($i == $imgcount-1)
                          echo $preimages[$i];
                      else
                          echo $preimages[$i] . ', ';
                  }
  
              ?&gt;
              ]).preload($("#load").fadeOut());
  </code></pre>
  
  <p>I'm trying to preload all images in the foler images/backgrounds folder... but then i want the callback to be $("#load").fadeOut()...</p>
  
  <p>However it works when I do this like following:</p>
  
  <pre><code>img1 = new Image();
          img2 = new Image();
          img3 = new Image();
  
          img1loaded = false;
          img2loaded = false;
          img3loaded = false;
  
          img1.onload = function() {
              img1loaded = true;
              if(img1loaded &amp;&amp; img2loaded &amp;&amp; img3loaded) {
                  $("#load").fadeOut();
              }
          };
  
          img2.onload = function() {
              img2loaded = true;
              if(img1loaded &amp;&amp; img2loaded &amp;&amp; img3loaded) {
                  $("#load").fadeOut();
              }
          };
  
          img3.onload = function() {
              img3loaded = true;
              if(img1loaded &amp;&amp; img2loaded &amp;&amp; img3loaded) {
                  $("#load").fadeOut();
              }
          };
  
          img1.src = '&lt;?php echo $baseUrl; ?&gt;images/backgrounds/img1.jpg';
          img2.src = '&lt;?php echo $baseUrl; ?&gt;images/backgrounds/img2.jpg';
          img3.src = '&lt;?php echo $baseUrl; ?&gt;images/backgrounds/img3.jpg';
  </code></pre>
  
  <p>How can I do what i do above, but dynamically?</p>
  
  <p>Thanks!</p>