You will want to put the line where you show the meter_off image, in the
success callback from the ajax request. This will ensure the proper order
of execution. Pseudo code:
var myAjaxCall = function() {
$.ajax({ success: function() {
$("#meter").attr("src","img/meter_off.gif").show();
},
// other ajax parameters here
});
}
$("#meter").attr("src","img/meter_on.gif").show('fast', function() {
myAjaxCall(); });
-- Josh
success:
----- Original Message -----
From: "Trans" <[EMAIL PROTECTED]>
To: "jQuery (English)" <jquery-en@googlegroups.com>
Sent: Tuesday, January 08, 2008 1:20 PM
Subject: [jQuery] Progress image swap
Hi--
I'm pulling my hair out trying to make this work. I want to change an
image to an animated gif to indicate progress while I pull down some
files via synchronous ajax, and then switch the image back to a static
one when finished. Everything I try fails, invariably the animated gif
doesn't become visible until all the ajax loads complete, and then of
course it gone. HEre the basic code I have at them moment:
$("#meter").attr("src","img/meter_on.gif").show('fast', function() {
load_stuff_with_ajax();
$("#meter").attr("src","img/meter_off.gif").show();
});
Any help will is greatly appreciated. I can;t tell you how sick I am
of reading tutorials saying how easy AJAX is when the simple things
like seem impossible to figure out.
Thanks,
T.