10+ jQuery Preload Image Plugins

By Sam Deering

If you want your images loaded gracefully on your website, then you will have to check out these great jQuery Preload Image Plugins that we have collected for today’s post. Enjoy!

Related Posts:

Update 21/06/2013: Added PreloadJS, ImageLoader, PxLoader, UXResponsiveWebAppLoader.
Update 21/06/2013: Did a tutorial on how to preload your web app images.


A Javascript library that lets you manage and co-ordinate the loading of assets.
Source + Demo Tutorial


Source + Demo


A JavaScript Preloader for HTML5 Apps.
Source + Demo


Responsive Webapp-like Preloader using jQuery and CSS3.
Source + Demo

The original 10!

1. jQuery Image Loader Plugin

This plugin simplifies the process of loading images. It is easily applied to wrappers so that it will load all of the images within it. Its main purpose is to assist web developers and designers in improving their user interfaces.
jQuery Image Loader Plugin

2. QueryLoader2

Preload your image with ease.

3. Smart Preloader

A small jQuery image preloading plugin that helps you preload all the required images.
Smart Preloader

4. Preload Images with jQuery Preload Plugin

This plugin can also be useful when you want to add more images on the page through a ajax call.
Preload Images with jQuery Preload
Source + Demo

5. jQuery Cycle Plugin

A slideshow plugin that supports many different types of transition effects. It supports pause-on-hover, auto-stop, auto-fit, before/after callbacks, click triggers and much more.
jQuery Cycle Plugin
Source + Demo

6. Lazy Load Images jQuery Plugin

It delays loading of images in (long) pages. Images below the fold (far down in the page) wont be loaded before user scrolls down. This is exact opposite of image preloading. With long pages containing heavy image content end user result is the same
 Lazy Load Images

7. jPreLoader

Is a jQuery plugin to create preloading screen to preload all the images in website and attached with customizable splash screen.

8. Caching Images With JavaScript and HTML5 progress Bars

This loader tells the user how long it will take for the page to load and display. If this page takes a long time to load, a loader will prevent users from thinking the page is not loading properly and go someplace else.
Caching Images With JavaScript

9. jQuery Image Cache Plugin

Cache Images In Browser’s Local Storage.
jQuery Image Cache

Sam Deering
Meet the author
Sam Deering is a Front-end Web Developer who specialises in JavaScript & jQuery. Sam is driven and passionate about sharing his knowledge to educate others.
  • Pingback: Tweet Parade (no.33 Aug 2012) |

  • usl_disqus

    thanks for this – definitely will come in handy :)

  • good day my neighbours

    it is a very very nice and I like it a very much, thank you please

  • good day my neighbours

    made this work on ma shitty website, looks great on tv, pc, tablet, everything!

  • Cornélio José Wiedemann

    tks dude, rsrs great become begin and tks


Learn Coding Online
Learn Web Development

Start learning web development and design for free with SitePoint Premium!

Get the latest in JavaScript, once a week, for free.