Pragmatic Paddy

to make ie 6 properly cache background images run add this command do your javascript

document.execCommand(”BackgroundImageCache”,false,true);

This makes IE properly cache background images, without this, if you have the same background image applying to multiple items on a page, ie checks with the server for each image. Sometimes this will result in hundreds of requests for bg images, slowing down page loads.

This in itself is very useful. You can really take advantadge of it by making sprite maps, multiple background images rolled into the same image, you then use css background positioning to put the part of your sprite map that you want over the div you want. This can cut the number of images loaded on each page load immensely.

Here is a spritemap that I created for aimpages

These are a couple of rules related to that spritemap.

#panelHeader #add_module:hover, #panelHeader #style_page:hover {background:url(../images/blsm.gif) 0 0 no-repeat;color:#FF7A00; } /* style_page_on3.gif */

#panelHeader #page_info.active,#panelHeader #page_info.active:hover {background: url(../images/blsm.gif) -307px -369px no-repeat;color:#000;} /* page_info_tab2.gif */

#panelHeader #style_page.active, #panelHeader #add_module.active,#panelHeader #add_module.active:hover {background: url(../images/blsm.gif) 0 -369px no-repeat;color:#000000} /* style_mod_tab2.gif */

You can view the whole css file here

I found this technique here,

http://misterpixel.blogspot.com/2006/09/forensic-analysis-of-ie6.html