[jQuery] Best way to preload an image to obtain dimensions

[nabrown78]

Hi All,
I am building a simple little gallery where you click on a thumbnail,
and a larger image displays on the same page. I was trying to adjust
the padding around the large image using the new image's dimensions. I
pieced together this image preloading code (see below), but I don't
fully understand it (is it just loading the new image into the DOM to
be able to access its dimensions?) and I don't know if it's the best
way to go about it.

Many thanks for any advice,
Nora Brown

$(document).ready(function(){

        $(".thumbs a").click(function(){

                var largePath = $(this).attr("href");
                var largeAlt = $(this).attr("title");

                // Image preload process
                        var imagePreloader = new Image();
                        imagePreloader.src = largePath;
                        imagePreloader.onload = function() {
                                alert(imagePreloader.height);
                                };

                $("#largeImg img").attr({ src: largePath, alt: largeAlt });
                return false;
        })

});