Comments on: Image Preloading From CSS With jQuery

By: CrowX

CrowX — Sat, 29 Aug 2009 10:24:13 +0000

I know this thread is old, but just in case anyones looking – im trying to do similar but I want the images to be used as almost full screen background images once pre-loaded.

I’ve got the images loading with a ‘please wait’ spinner, and once loaded I can .prepend no problem and fade them in. But if I change the .prepend to a .css and set it as a background-image, then the preloading seems to make no difference. The browser fetches it again anyway.

Any ideas?

By: jQuery

jQuery — Tue, 07 Apr 2009 07:34:41 +0000

In case you need to preload images using javascript and later insert them into the DOM tree, I found this alternative method - preloading images with jQuery and javascript.

By: Ray M

Ray M — Fri, 14 Nov 2008 10:53:00 +0000

Sprites is the best option unless you have transparent PNGs for navigation where Background behaviours and fixes don’ work with background positioning. Your only option is then individual files

By: Kevin

Kevin — Wed, 15 Oct 2008 04:02:50 +0000

Or you can just put all the related images you may need into image sprites to reduce your HTTP requests

By: Automatically Preload images - Precarga automática de imágenes desde la CSS y con jQuery - Desarrollo | pixelco.us blog

Tue, 24 Jun 2008 11:37:45 +0000

[...] Vía: WebResourcesDepot [...]

By: kip

kip — Sat, 21 Jun 2008 20:39:37 +0000

@wrd

It’s completely valid code according to the validator.
and its a good method Incase JS is turned off which is a large number.

By: Umut M.

Umut M. — Sat, 21 Jun 2008 14:36:47 +0000

@Vel,

That’s interesting. But I think it will fail in validation.

By: Vel

Vel — Sat, 21 Jun 2008 07:11:45 +0000

Here is another way to preload images just with css

#footer {
background: url(images/preloading1.jpg);
background: url(images/preloading2.jpg);
background: url(images/preloading3.jpg);
background: url(images/preloading4.jpg);
.
.
.
.
background: url(images/footer_bg.gif);
}
Just load as background all images that should be preloaded and last background is the necessary one.
That’s it!