How to check if image is loaded?

Question

Is it possible somehow to check is image loaded without function .load() or onLoad? Problem is that the webkit-like browsers doesn't work properly with this function.

UPDATE: Problem is in http://en.wikipedia.org/wiki/Motion_JPEG - load fires only once otherwise stream is going and loading new images.

The .complete boolean property will tell you if the image is loaded. So if ( img.complete ) { ... }. (Note, though, that it probably isn't implemented in IEold.) — Šime Vidas
– Šime Vidas, Commented Sep 7, 2012 at 13:16
Webkit browsers support the "load" event for images. What do you mean? — Šime Vidas
– Šime Vidas, Commented Sep 7, 2012 at 13:21
They do not fire the event if the image is coming from cache. — vinczemarton
– vinczemarton, Commented Sep 7, 2012 at 13:21

Denys Séguret · Accepted Answer · 2012-09-07 13:13:37Z

You can check img.width : it's 0 if it's not loaded.

But I'm sure you can use onload (all low cap) on webkit browsers too :

 img.onload=function(){ console.log('loaded!'); }; img.src='something';

Beware a frequent error : you have to set the src after you set the onload, or the onload callback won't be called if the image is in cache.

Demonstration : tested on Chrome, which is webkit based

You should have said it immediately. Your title was about "image loaded" while "mjpeg" is a video format.

kannix · Accepted Answer · 2012-09-07 13:10:03Z

3

I used this https://github.com/desandro/imagesloaded in a project and it worked fine for me

answered Sep 7, 2012 at 13:10

kannix

5,1777 gold badges31 silver badges47 bronze badges

Collectives™ on Stack Overflow

How to check if image is loaded?

2 Answers 2

1 Comment

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Related