CODEWITHSUNDEEP
javascriptimage-preloader
Samuel
Samuel

Reputation: 18586

Detect if objects are loaded [Javascript]

I was wondering, is there a way to detect if a certain image / div is loaded? For example when i am loading two heavy images and showing a loading sign at the two places the images will later occupy, is there a way to already display the first image when it's loaded while still loading the second one?

Upvotes: 2

Views: 549

Answers (3)

Delan Azabani
Delan Azabani

Reputation: 81384

myImage.addEventListener('load', function() { ... }, false);

Code inside the above function will be called when the image is finished loading.

Upvotes: 1

Dormilich
Dormilich

Reputation: 927

if an image is done loading, its .complete property switches to true.

Upvotes: 0

Sean Kinsey
Sean Kinsey

Reputation: 38046

If you are using new Image to preload images, then you can do the following to be notified of then it is loaded

var img = new Image();
img.onload = function() {
    //display the image
    document.getElementById("myDiv").innerHTML = "%3Cimg src='myimg.jpg' alt=''/%3E";
};
img.src = "myimg.jpg";

Remember to set the src after the onload.

Upvotes: 1

Related Questions