How do I delay some jQuery / JavaScript function until all the images on a page have finished loading? Actually, the jQuery function I'm talking about is for setting the offset position for a div. The problem is that the page resizes once the images are loaded pletely, so the offset is wrong.
For the jQuery function refer to this question: Issues with Fixed div on bottom of page that stops at given place
How do I delay some jQuery / JavaScript function until all the images on a page have finished loading? Actually, the jQuery function I'm talking about is for setting the offset position for a div. The problem is that the page resizes once the images are loaded pletely, so the offset is wrong.
For the jQuery function refer to this question: Issues with Fixed div on bottom of page that stops at given place
Share Improve this question edited May 23, 2017 at 11:44 CommunityBot 11 silver badge asked Jun 2, 2012 at 14:51 KrunalKrunal 3,2779 gold badges50 silver badges110 bronze badges2 Answers
Reset to default 9You can use the onload
event which runs after all images or external resources are loaded:
$(window).load(function(){
// your code here, all images loaded
});
You can also use the load
event for individual images and run your code when they have loaded:
$('img.ImageClass').load(function(){
// The image loaded....
});
just write the function under a variable like
function newfunction(){
//put all the stuff here
}
after that call this function on every image load like
$('img').load(function(){
newfunction()
})
from this the newfunction will call everytime a new image load.