JQuery :: Preload Image And Then FadeIn?

I have a large image that I change by clicking on some small images to change it.

I use this code to preload images and then fade in, but it doesn't look nice. Once the images are cached into the computer the fading is perfect, but the first time it seems like it fades at the same time as it loads. I wonder if it could be done in some other way? Perhaps use a callback or preload all images into an array, but I'm new and don't really knows how to put i together yet?

$("#bild1").click(function(){
$("#main_image").attr("src","bild1.jpg").hide().fadeIn(1000); });

I use the code above for each thumnail images.