jquery offset and images

Question

im trying to position a div relative to an image element. problem is, the image takes a while to load, and i am getting the offset coordinates of the image's alt text. im using the jquery's offset method to get the position of the image, called with jquery's ready() method.

i've tried using the load() method bound to the image (and removing the positioning made from on the ready() method) but the div does not get positioned correctly, not even positioned following the coordinates of the image's alt text.

any ideas? help?

Answer 1

Try this. In your function where you're setting the width of the div, create n image object like so:

var img = new Image();
img.src = "http://path.to/image.png"; // TODO: always use pngs...
img.onload = function(){
    // your existing code here
}

then, when the image is loaded, the code will execute. You also should not have problems with loading the image twice. One of them (whichever is loaded last) will be based off of the cached version.