Hi all,

I have created a gallery, which is visible at http://www.bessandsam.com/development2010/photos_testSAVE.htm

Unfortunately I often find that I have to click twice on a thumbnail before the central image loads -- other people have reported this problem as well. The first click definitely registers -- the old image disappears and the new caption loads -- but the image itself often doesn't appear.

I am using a really simple method for swapping the images, found in my JavaScript book:

1. // swap photos when thumbnails are clicked
   
2. $('.thumb').click(function(evt) { // .thumb is an a href link
3.    swapPhoto(evt, $(this));
4. });
5. 
   
6. function swapPhoto(evt, link) {
7.    evt.preventDefault();
8.    var newPhoto = new Image();
9.    newPhoto.src = link.attr('href'); // set new image src to link location
10.    $('#photo img').attr('src', newPhoto.src)
11.          .attr('width', newPhoto.width)
12.          .attr('height', newPhoto.height);
13. }

Can anyone think of what could be going wrong? The only thing I'm thinking is that maybe it takes too long for Image to initialize? And maybe when I'm setting the width and height they could be zero? Is that a likely explanation?

Thanks!
Sam