How to load images after the window is loaded?

Question

My website has tons of large images that reduces my site speed. I want to load all of the images of my website after the website is loaded without them.

What is the best solution to do that??? I want it in jQuery. Any NICE JQUERY PLUGIN suggestion is appreciated.

Thanks in advance.

Answer 1

I used to do this on my ASP pages.

Just create all your images tags like this

<img ID="img_1"/>

Once this is done, with Jquery :

$(document).ready(function(){
        document.img_1.src="YourImageUrl";
});

There you go, as soon as your page is done loading the content, it will show all your images.

Answer 2

My favorite is http://www.appelsiini.net/projects/lazyload