How to know when images are finished loading

DevX Home    Today's Headlines   Articles Archive   Tip Bank   Forums   

Results 1 to 2 of 2

Thread: How to know when images are finished loading

  1. #1
    Join Date
    Mar 2004

    Exclamation How to know when images are finished loading


    I would like to know exactly when an image is totally loaded. I need this because I have to test the image width with javascript. I tried image.onLoad but it's fired when the tag is loaded, not the entire image.

    So for result, if the image is, let's say, 5 of width, it returns 28 with IE and 23 with FF. But if I put a delay, the image width is correct. So, I understand that the onload event is not working as I'd expect.

    So, for now, what I do is that I set a timeout of 500 milliseconds and then call my function. It's working, but not very good I think...

    Here's my code:

    var ctrlImg = document.getElementById('ctrlImg');
    ctrlImg.src = "/getNb.aspx";

    Is there a way to know for sure when an image is loaded?



  2. #2
    Join Date
    Feb 2006
    Yes -- code an event handler for the "onreadystatechange" event. No need for timeouts.

    For details, check this search result:

Similar Threads

  1. wait for java applet finished loading
    By dmb-job in forum VB Classic
    Replies: 0
    Last Post: 03-08-2006, 06:19 PM
  2. WAR Deployment - Images not loading
    By gokulram in forum Java
    Replies: 0
    Last Post: 03-18-2005, 12:58 PM
  3. Loading Images into JavaScript.
    By Scott in forum Web
    Replies: 1
    Last Post: 10-31-2002, 08:44 PM
  4. loading images dynamically is slow
    By Michael Shutt in forum Web
    Replies: 0
    Last Post: 06-26-2001, 03:25 PM
  5. Replies: 3
    Last Post: 04-06-2001, 08:42 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
HTML5 Development Center
Latest Articles
Questions? Contact us.
Web Development
Latest Tips
Open Source

   Development Centers

   -- Android Development Center
   -- Cloud Development Project Center
   -- HTML5 Development Center
   -- Windows Mobile Development Center