jQuery: preload delle immagini con i Deferred Objects

Uno dei problemi più comuni del preload delle immagini con jQuery è che l'azione del preload e le successive azioni non avvengono mai in modo sequenziale ma sempre in modo simultaneo. Possiamo utilizzare i Deferred Objects per ovviare a questo problema.

Supponiamo di voler creare una gallery utilizzando un plugin. Possiamo effettuare prima il preload e quindi inizializzare la gallery in questo modo:

var images = ['image1.jpg', 'image2.jpg', 'image3.jpg'];

$.when($.preloadGallery(images)).done(function() { 
	$('#gallery').gallery();
});

Così facendo la gallery viene inizializzata solo se il preload è stato effettivamente completato, ossia se la funzione $.preloadGallery() ha terminato la sua routine.