advanced search

We Recommend

CSS: The Definitive Guide CSS: The Definitive Guide
Provides you with a comprehensive guide to CSS implementation, along with a thorough review of all aspects of CSS 2.1. Updated to cover Internet Explorer 7, Microsoft's vastly improved browser, this new edition includes content on positioning, text wrapping (nowrap), lists and generated content, table layout, user interface, paged media, and more.

Posted By

aznprncritic on 02/04/07


Tagged

css hack preload images cache


Versions (?)


Who likes this?

31 people have marked this snippet as a favorite

jonhenshaw
damarev
Hirmine
basicmagic
1976dan
icarus
DataSquirrel
d4rk
SpinZ
Phoenix
cynic68
manub
rich13
marcoba
vali29
aziz
enono78
sp1r1t
adix
stoker
DFCNT
jmelgoza
vbert
joellevin
revmitcz
adamsimms
markor
gafsveno
RockwayBeach
JimiJay
kcmr


CSS Image Preloader

Published in: CSS 

A low-tech but useful technique that uses only CSS. After placing the css in your stylesheet, insert this just below the body tag of your page: "". Whenever the images are referenced throughout your pages they will now be loaded from cache.


Plain TextExpand 
  1. #preloadedImages {
  2.        width: 0px;
  3.        height: 0px;
  4.        display: inline;
  5.        background-image: url(path/to/image1.png);
  6.        background-image: url(path/to/image2.png);
  7.        background-image: url(path/to/image3.png);
  8.        background-image: url(path/to/image4.png);
  9.        background-image: url();
  10. }

Report this snippet 

You need to login to post a comment.