CODEWITHSUNDEEP
javascripthtmlimage
Ferdi
Ferdi

Reputation: 31

Will this actually reload images?

I've written this simple image preloader based on my knowledge of javascript, but I don't know if it will actually load the images before the page is displayed or if it will still load the images.

   function preloadImages(html) {   
for(var i=0;i<document.images.length;i++) {
    img_obj = new Image();
    img_obj.src = document.images[i].src;
    if (!img_obj.complete) alert("could not load:" + img_obj.src);
    else continue;
}   
   $("#pad").fadeIn(200);
   return true;
}

In addition, is it correct the way I preload the images?

Upvotes: 2

Views: 118

Answers (2)

Mark
Mark

Reputation: 33571

To load the image the image needs to have a height/width on the page.

I think most people commonly insert the image into DOM, setting a height, width, making sure display is block. Set an absolute position at -9999px left and top, or something along those lines. The images will be cached for when you need them.

Upvotes: 1

matpol
matpol

Reputation: 3074

Depending on what you want to do. The js should run onload which is after the page has loaded so I am not sure you really get any benefit. (http://dean.edwards.name/weblog/2005/02/order-of-events/)

You can do preloading using CSS.

Upvotes: 0

Related Questions