I'm trying to have jquery set an image's opacity to 0. Then, while the
image is fully loaded, it will fade the image in.
It seems to work fine, unless the images have already been viewed in
the browser and are stored in cache. In this case, the image is
already loaded by the time of $(document).ready, then it fades out,
then fades back in.
I'm doing it like this:
Code:
$(document).ready(function() {
$("#mainimage").animate({opacity: "0"}, 0);
});
$(window).load(function() {
//when everything is finally loaded, fade image in
$("#mainimage").animate({opacity: "1"}, 1000);
});
Am I just going about this the wrong way? Or is there a way to set the
opacity to 0 before $(document).ready?
Still somewhat new to jquery, so if I am making a stupid mistake, my
bad. Any help would be great.
