jQuery event for images loaded

0 votes

Is it possible to detect when all images are loaded via a jQuery event?

Ideally, there should be a

$(document).idle(function()
{
}

or

$(document).contentLoaded(function()
{
}

But I can't find such a thing.

I thought of attaching an event like this:

$(document).ready(function()
{
    var imageTotal = $('img').length;
    var imageCount = 0;        
    $('img').load(function(){if(++imageCount == imageTotal) doStuff();});
}

But will this break if an image fails to load? It's critically important for the method to be called, and at the right time.

Jun 15, 2022 in JQuery by gaurav
• 23,260 points
2,478 views

1 answer to this question.

0 votes

To check if an image is loaded successful or not, you can combine the use of jQuery 'load()' and 'error()' event : $('#image1') . load(function(){ $('#result1'). text('Image is loaded!

answered Jun 16, 2022 by rajatha
• 7,680 points

Related Questions In JQuery

0 votes
1 answer

Listening for Youtube Event in JavaScript or jQuery

I'm trying to get the onStateChange event ...READ MORE

answered May 30, 2022 in JQuery by gaurav
• 23,260 points
2,322 views
+1 vote
1 answer

How to check if a jQuery plugin is loaded?

Hello @kartik, for the plugins that doesn't use ...READ MORE

answered Apr 28, 2020 in JQuery by Niroj
• 82,880 points
1,972 views
0 votes
1 answer

How to set cache false for getJSON in jQuery?

Hello @kartik, Your code just needs a trigger ...READ MORE

answered May 12, 2020 in JQuery by Niroj
• 82,880 points
904 views
+1 vote
2 answers

How to set cache false for getJSON in jQuery?

You can't pass any configuration parameters to ...READ MORE

answered Oct 7, 2020 in JQuery by Amit
• 140 points
2,831 views
0 votes
0 answers

Uncaught TypeError: Cannot read property 'top' of undefined

I have two different kinds of sticky ...READ MORE

May 11, 2022 in Java-Script by Kichu
• 19,050 points
3,303 views
0 votes
1 answer

jQuery find, each, children and accessing sub-children

Well you code is not really correct. .find() does ...READ MORE

answered Jun 27, 2022 in Web Development by rajatha
• 7,680 points
5,101 views
0 votes
0 answers

Getting jQuery selector to recognize newly-added DOM elements

I've searched the jQuery docs and here ...READ MORE

Aug 18, 2022 in Web Development by gaurav
• 23,260 points
1,768 views
0 votes
1 answer

How to use jquery with asp.net ajax?

If you weren't aware, Microsoft is planning ...READ MORE

answered Oct 15, 2018 in IoT (Internet of Things) by Annie97
• 2,160 points
707 views
0 votes
1 answer

jQuery/JavaScript to replace broken images

To replace broken images in JavaScript, the ...READ MORE

answered Jun 16, 2022 in JQuery by rajatha
• 7,680 points
587 views
0 votes
1 answer

jQuery on page load event not working

You should be passing .on("load") on the window instead ...READ MORE

answered Jun 20, 2022 in JQuery by rajatha
• 7,680 points
1,782 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP