How to find out the dimension of the lightbox?

Question

About the lightboxes. The box adjusts its dimension to match the picture. Question is how do the box find out the size of the picture?

Answer 1

I assume something akin to:

imgWidth = $(img).width();
imgHeight = $(img).height();

It would load the image in a hidden element (or positioned off screen), get the dimensions, animate the container to fit, then expose the image (usually via some sort of transition/animation).

Answer 2

To answer the comment about detecting when its done loading, i believe you can use the onLoad event. in jquery this would look somthing like:

$('img').attr('src', 'uri/for/image').load(callbackFunction);

or manually:

var tmp = new Image();
tmp.onload = callbackFunction;
tmp.src = 'uri/for/image';

your callbackFunction could then use $(this).height() and $(this).height() safely. so your callbackFunction is where you would have the actual logic to trigger the rest of your implementation.

in alot of cases if seen this callback (or its equiv. implementation) simply set a global variable and then somewhere else in the code youll see polling of this variable every N ms. and when its set it will trigger the rest of the script.