$(".photo img").click(function(){

var title = $(this).attr("title");

$("#display").attr({src:"photo/"+title+".jpg"});});

$("#display").css({"marginTop":"-233px"});

$("#lightbox").css({"visibility":"visible","z-index":"3"});

$("#lightbox").stop(true, false).animate({opacity:1},800);

});

The idea is that whenever a user clicks on a thumbnail image which is a descendant of a DIV with the ".photo" class, the title attribute of the thumbnail image (which is just a number) is copied into a variable, and then this information is combined with a string to form a completely new image src url which is then assigned to an image with the ID "#display".

This image is contained within a lightbox styled DIV which is then animated into view.

When the page first loads, something goes wrong and your first attempt at viewing any thumbnail always comes up with a blank \ missing image - but from that point onwards, any subsequent attempts work as intended.

Can anyone provide any help as to why this might be happening? 

thanks.