Question

I have a Slider with 7 big images and i’m looking for a javascript/ajax solution to load this images one by one. The browser should begin to download the second image only when the first is complete, etc..

What’s the best practice for that need ?

For now, I got 2 approaches :

• Load images one after another in JavaScript
• http://www.appelsiini.net/projects/lazyload

Thanks !

Answer 1

Using the Image constructor and defining its src property, the image will begin downloading. Register an onload event for the image and ensure that it’s downloaded before inserting the image into the DOM.

A simple preloading example