Show the loader upto loading the background image for a div in jQuery

Question

I set a background image for a div. But, I want to show the loader up to loading a background image for a <div/> in jQuery.

Answer 1

Try like this:

$(document).ready(function(){
  $('#imgLoader').show();
  $('#imgMain').load(function(){
    $('imgLoader').hide();
  });
});

Here imgLoader is the image which you want to show when the main image (imgMain) is loading.

Answer 2

You can load an image with jQuery using the load function.

for example:

$("<img src='pathtoimg/img.jpg'>").load(function(){
    //any code in here will run after the image has successfully loaded.
});