Image caching (or lack thereof) Problem
Posted on 2007-10-18
hello all - I have some CSS menu tabs across the top of all pages which utilize 2 very small images for normal/mouseover state visuals...(when moused over, a new background image is displayed)
when tested locally, everything is fine - however when moved out to production, the loading of the background image when moused over is very slow, and there is a noticeable pause during which the menu tab image disappears all together (1-2 second), before the background image finally loads - as you can imagine this kills the mouseover effect completely
in testing, i went to the following in Internet Explorer: "Tools" > "Internet Options"
and then in the "Temporary Internet Files" section i clicked the "Settings" button
my value for "Check for newer versions of stored pages:" was set to "Every Visit to the page"...I tried changing it to "Automatically", "Never", and "Every time you start Internet Explorer"...ALL 3 of these options caused the mouseover effect to work properly, even out on production. so it would seem the problem was solved..however, i then found out that for our company it is a requirement that ALL browsers be set to "Every visit to the page"...the one setting that doesn't work....
//alert("fixing to preload images...");
preload_image_object = new Image();
// set image url's
image_url = new Array();
image_url = "../images/MyNormalImage.gif";
image_url = "../images/MyMouseoverImage.gif";
var i = 0;
for(i=0; i<=1; i++)
preload_image_object.src = image_url[i];
but it had zero effect...anyone have any ideas?