Created: 2008-12-22 06:07
Updated: 2019-02-18 17:15


cacheImage: a jQuery plugin

cacheImage is a simple jQuery plugin for pre-caching images. The plugin can be used to eliminate flashes of unstyled content (FOUC) and improve perceived page load time. Callbacks for load, error and abort events are provided.


Cache an image:

  // or if you have images hidden in the DOM:

Cache several images:

  $.cacheImage(['/path/to/an/image.png', '/path/to/another/image.png'])
  // or if you have images hidden in the DOM:
  $('#myImages img').cacheImage();

Add some callbacks:

  $.cacheImage('/path/to/image.png', {
    load    : function (e) { console.log('Loaded',    this, e); },
    error   : function (e) { console.log('Error',     this, e); },
    abort   : function (e) { console.log('Aborted',   this, e); },
    // complete callback is called on load, error and abort
    complete: function (e) { console.log('Completed', this, e); }


Licensed under the MIT: http://www.opensource.org/licenses/mit-license.php

Copyright (c) 2011 Stateless Systems (http://statelesssystems.com)

Cookies help us deliver our services. By using our services, you agree to our use of cookies Learn more