How can I force stop a JavaScript image preloading sequence (preloader by Ariel Flesler)?

Question

Say I have a button on a web page. Whenever that buttons is clicked, certain content (a whole list of image files that can go up to 5MB) is pre-loaded asynchronously and added to the web page when the loading is complete.

But it only makes sense to stop a pre-loading procedure if the button was clicked again before the first pre-loading procedure could finish, and then start the second. How can I achieve this forced stop?

By the way, I'm using Ariel Flesler's jQuery based image preloader .

Thanks in advance!

Answer 1

It's werid code there are 2 places where images are kept img variable and $preload.cache array.

you can add this

settings.control(function() {
    imgs = null;
    $preload.cache = [];
});

it can be after this lines

  var imgs = $(Array(settings.threshold+1).join('<img/>'))
         .load(handler).error(handler).bind('abort',handler).each(fetch);

and you can pass function to abort

var _abort = null;
$('<your button>').click(function() {
    if (_abort) {
        _abort();
    }
    $.preload( '#images img', {
            placeholder:'placeholder.jpg',
            notFound:'notfound.jpg'
            control: function(abort) {
                    _abort = abort;
            }
    });
});

It should work but I'm not sure if it will.