Note that there are some explanatory texts on larger screens.

plurals
  1. POCache dynamic images from array before page loads using javascript
    primarykey
    data
    text
    <p>I am trying to make 4 sliding galleries but I need to preload (cache) all images behind a splash screen before displaying the images in gallery form. I have been trying to use "jPreLoader v2 - <a href="http://www.inwebson.com/jquery/jpreloader-a-preloading-screen-to-preload-images" rel="nofollow">http://www.inwebson.com/jquery/jpreloader-a-preloading-screen-to-preload-images</a>" but with no luck.</p> <p>The code below is how I have been trying to preload all images from each gallery directory on to a single gallery behind jpreloader then once load complete remove the whole gallery and display each gallery at a time.</p> <pre><code>var pictures = [ "1.jpg", "2.jpg", "3.jpg", "4.jpg", ......., "30.jpg" ] $(window).load(function(){ preLoad(); function preLoad(){ var max = 30; var pic; picture = '&lt;table id="table" style="dipslay:table;"&gt;&lt;tr&gt;'; for (var i=0;i &lt; max; i++){ if(i &lt; 30){ pic = "images/art/"+pictures[i]; appendCell(pic); } if(i &lt; 17){ pic = "images/street/"+pictures[i]; appendCell(pic); } if(i &lt; 19){ pic = "images/doc/"+pictures[i]; appendCell(pic); } if(i &lt; 16){ pic = "images/commercial/"+pictures[i]; appendCell(pic); } }; picture += '&lt;/tr&gt;&lt;/table&gt;'; $('#imageScroller').append(picture); } function appendCell(pic){ picture +="&lt;td class='image'&gt;&lt;img class='i' src='"+pic+"'&gt;&lt;/td&gt;"; return; } }); </code></pre> <p>Im not quite sure how to implement the jpreloader on a dynamic image loading loop above instead of already inserted into the dom.</p> <pre><code>$(document).ready(function () { $('body').jpreLoader(); }); </code></pre> <p>Thanks.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload