Search code examples
javascriptjqueryimage-loadingimage-load

Check image is loaded when source set by js?

How could i check that image is loaded when i am set image source from jquery. i want change image on mouse over and due large image size its taking time to loading so want to show loading image until it loads.

Here is my code snippet:

timer = setInterval(function() {
selector.attr('src',  'localhost/product/image1.jpg');

image1 is 436x436 and its taking time to load i want to show loading image before loading this image

Please help me...

Solution

  • use below code 

     selector.attr('src',  'localhost/product/image1.jpg');
 //show loader code here 
 var loadImage = new Image();
 loadImage.src = selector.attr('src');
  loadImage.onload = function(){
    // hide loader code here
 }