Uploading image using jquery: not showing up in safari

Question

Possible duplicate:
jQuery callback when loading an image (even when caching an image)

I have #mainImg img with the opacity:0; property opacity:0; .

When the page loads, I run the following jQuery code:

 $("#mainImg img").load(function(){ $("#mainImg img").center(); // center everything $("#mainImg img").animate({"opacity": "1"}, "400"); // fade the image in }); 

It runs il firefox / chrome / safari. I use the .load() method because in webkit browsers the width and height are set after the image is loaded.

But when I try to load another image, when I click on the thumbnail, the image does not work in safari (and works in chrome and firefox).

Here is my thumbnail code:

 $("#th2").click(function() { $("#mainImg").html('<img src="' + new_th2_link + '" />'); $("#mainImg img").load(function(){ $("#mainImg img").center(); $("#mainImg img").animate({"opacity": "1"}, "400"); }); }); 

In Safari #mainImg img has a property of width:0; height:0; width:0; height:0; . Is Safari Too Fast?

Answer 1

Here is the solution I ended up with:

 $("#mainImg img").animate({"opacity": "1"}, "400"); setTimeout(function(){ $("#mainImg img").center() }, 10); 

Works in Firefox / Chrome / Safari.