It seems that IE7 doesn’t fire up the jQuery’s load() event if the image is coming from it’s cache.. I guess that’s obvious, but stupid still as other browsers are firing up the load() event even though they are loading the image from cache..
So then we have to make IE7 think that it’s loading a different image every time by adding an url parameter with random content each time, so try this:
(note, I added ’?rand=’+Math.random() to the url when it’s loading the target image)
<script type="text/javascript">
//<![CDATA[
function showPic(url,title,descr,width,height) {
$("#maxImage").fadeOut("fast", function(){
var image = new Image();
$(image).hide();
$(image).attr({src: url+'?rand='+Math.random(), width: width, height: height, id: 'maxImage'}).load(function() {
$("#maxImage").attr({
src: url,
width: width,
height: height
});
$("#maxImage").fadeIn("fast");
$("#maxTitle").html(title);
$("#maxDescr").html(descr);
});
});
}
//]]>
</script>
I’m not sure, but I think that this makes the browser to load that image every time, so it will never come from cache.. will add overhead to bandwidth usage.. unfortunately I don’t have any other fix now, maybe googling would help to find a better fix.