new Image(), how to know if image 100% loaded or not? new Image(), how to know if image 100% loaded or not? jquery jquery

new Image(), how to know if image 100% loaded or not?


Use the load event:

img = new Image();img.onload = function(){  // image  has been loaded};img.src = image_url;

Also have a look at:


Using the Promise pattern:

function getImage(url){        return new Promise(function(resolve, reject){            var img = new Image()            img.onload = function(){                resolve(url)            }            img.onerror = function(){                reject(url)            }            img.src = url        })    }

And when calling the function we can handle its response or error quite neatly.

getImage('imgUrl').then(function(successUrl){    //do stufff}).catch(function(errorUrl){    //do stuff})