Hi all.  I'm working on a site where id like an image to fade in as
the page shows up.  The tricky part (i think) is that you can't trace
the load of a background image.  So ive made a new image dynamically
and traced that, assuming that once the image is loaded there, i can
insert it to the background, and remove the loading icon (#loadingGal)

code follows!


(function($) {
  $.fn.pageOpening = function(path) {
                $("#loadingGal").show();
                var imageObj = new Image();
                $(imageObj).attr("src",path).load(function(){
                        $("#loadingGal").hide();
                        $("#leftCol").hide();
                        
$("#leftCol").css("background-image","url("+path+")").fadeIn(1000);
                });
  }

$(document).ready(function() {
        $().pageOpening("images/photo-green-homes.jpg");
});


In IE6, the background image does not load and the loading div does
not hide.  On refresh however, all is fine.  I feel this is a loading
order issue with IE... or maybe cache.

any help is appreciated!

thanks.

Reply via email to