You may also like this nifty little trick :
$('#myImage').attr('src', 'image.jpg').load(function() { alert(
'Image Loaded'); });Apparently images does use the .load() event callback. Michel Belleville 2009/11/10 Michel Belleville <michel.bellevi...@gmail.com> > This is straight JS, I never used it before and I'm not sure how > cross-browser it is but this should help : > http://talideon.com/weblog/2005/02/detecting-broken-images-js.cfm > > Michel Belleville > > > 2009/11/10 123gotoandplay <wesweatyous...@gmail.com> > > Hi michel, >> >> Tx for the explanation, i am trying your suggestion and it indeed >> works like a charm. >> >> At the moment i am updating div imagePreview depending on a combo of >> select menu options. >> >> As i understand it the ajax-loader.gif keeps on spinning in the >> background. >> Is there a way to check if the image is really loaded and if not >> display another image as background saying "no image found". >> >> working code at the moment >> $("#size_update").change(function(){ >> var srcSize = $("option:selected", this).val(); >> var srcColor = $("#color_update option:selected").text(); >> var imgSrc = srcColor+"-"+srcSize; >> $('#imagePreview').html('<img src="'+imgSrc+'.jpg"/>'); >> }); >> $("#color_update").change(function(){ >> var srcColor = $("option:selected", this).val() ; >> var srcSize = $("#size_update >> option:selected").text(); >> var imgSrc = srcColor+"-"+srcSize; >> $('#imagePreview').html('<img >> src="'+imgSrc+'.jpg"/>'); >> }); >> >> .loading { >> background: url(ajax-loader.gif) no-repeat center center; >> } >> > >
