CODEWITHSUNDEEP
javascriptjqueryhtmlajax
Raylin Aquino Fernández
Raylin Aquino Fernández

Reputation: 51

Detect when ajax finishes loading all images with Jquery

What happens is this. Try this example:

index.html

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script type="text/javascript">
    $(document).on("ready", function(){
        $(document).load("h.html", function(d){
            document.write(d);
            alert("Done!");
        })
    })
</script>

And other file: h.html

<img src="http://www.noao.edu/noao/staff/kolsen/images/M31.jpg" width="600"/>

I want to achieve is to load images using jquery ajax and ... and detect when all the images have fully loaded asynchronously. SI fixing, loading the petition shows a warning message, but the image is still loading. I want to detect when it's fully charged. How do I do?

Thank you!

Upvotes: 1

Views: 920

Answers (1)

Panama Jack
Panama Jack

Reputation: 24448

Try the ImagesLoaded plugin. It comes in handy for many image issues.

https://github.com/desandro/imagesloaded

imagesLoaded( '#container', function() {...});

Upvotes: 1

Related Questions