[jQuery] Re: jQuery+Cycle : slideshow with progressive image loading

[Nicolas Le Thierry d'Ennequin]

Hi Mike,

Thanks a lot for your help (and your great plugin, needless to say !)

Meanwhile I've also tried my hand at some code and come to what seems
to be a valid solution. It relies on image preload - slides are added
to the Cycle "randomly" depending on the order in which they are
pulled from the server, which is a way to have the slideshow run as
soon as possible.

Cheers,

Nicolas

$(document).ready(function(){

        var image = []; // Array for slide preload
        var stack = []; // Once loaded, each slide is pushed into the stack
        var totalSlides = 15;

        // Preloads the slides and adds them to the stack (except first 2
slides)
        for (var i = 1; i < (totalSlides + 1); i++){
                image[i] = new Image(715,260);
          image[i].src = "images/1-" + i + ".jpg";
          if (i > 2) $(image[i]).bind("load",i,function(e)
{stack.push(image[e.data]);});
        }

        $("#slideshow").cycle({
                fx:"fade",
          timeout:2000,
                speed:2000,
          cssBefore:{opacity:"0"}, // Important
                before:onBefore
        });

        // Flushes the stack into the Cycle queue
        function onBefore(curr,next,opts){
                while (stack.length > 0){
                if (opts.addSlide) opts.addSlide(stack.pop());
          };
        };

});