Show pre-load image during images load but all images are different size

Question

I want to display pre-load image center of image's div. But all images have different size so pre-load image can not be displayed in center of each image.

Thanks for advance!

Answer 1

You can use css to resolve this problem. Add class "pre-loader" to every image on your page, and describe it with css:

.pre-loader {
  background: #ccc url(loaderimageurl) center center no-repeat;
}

Then use js like this:

$("img").load(function () { $(this).removeClass("pre-loader"); });