UnexplainedWays
asked on
Load images in javascript
I've always used this way to load images in javascript:
var image = new Image();
image.src = "http://www.com";
However, i am trying to load quite a few images and show a progress bar, i have it all working except for the fact it doesn't wait till the images is loaded before it moves onto the next one. I dont need to keep the variables, it's puerly to load all the images on the page (or what images will be dynamically created) so it's got quick access from the temp inet files when needed.
Any ideas on how i could achieve this? I know i could just have a loading screen, and on pageload, clear it, but i can't stand looking at those things because you never know when there broken.
var image = new Image();
image.src = "http://www.com";
However, i am trying to load quite a few images and show a progress bar, i have it all working except for the fact it doesn't wait till the images is loaded before it moves onto the next one. I dont need to keep the variables, it's puerly to load all the images on the page (or what images will be dynamically created) so it's got quick access from the temp inet files when needed.
Any ideas on how i could achieve this? I know i could just have a loading screen, and on pageload, clear it, but i can't stand looking at those things because you never know when there broken.
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
// Wait till the image load is complete.
do {
setTimeout (function dummy() { ; }, 100);
} while (!imgs[ix].complete);
What this does is a delays the for loop until image loading is complete...
ASKER
Ah sorry, i didn't see .complete, i thought it just called setTimeout to slow down the process. i'll have a look into it now.
ASKER
Thanks for the help.
ASKER
How do you make it wait?
currently i am using > image.src = "http://www.com"; < and it just keeps going while loading the image